webpack+vue2.0项目 (一) vue-cli脚手架
很早以前就开始看vue2.0和webpack,但总是留不下深刻的印象,一直缺少一个可以贯通的项目,而且工作也没有时间,最近辞职在家,从网上找了个项目,写了大概八天,踩了无数的坑啊!!
下载的项目包括,设计图,源码什么的都有,只不过是它基于vue1.0构建的,我用vue2.0从头写了一遍
先写下项目流程
1.vue-cli脚手架创建项目目录(具体可见官网:https://github.com/vuejs/vue-cli)
npm install vue-cli -g
初始化项目依赖:(选择webpack来构建打包项目)
vue init <template-name> <project-name>
vue init webpack my-project
上面那几个相应的选择下,ESLint是规范代码,我关了,因为开了之后很蛋疼,一直报错,喜欢的可以开下,感受一下,下面两个是用来单元测试的,不用开;
此时你的根目录下应该会有自多搭建的相应的目录
打开根目录下的 package.json 文件,里面是本次项目所需要的依赖,就是各种压缩,解析,路径等等的东西;所以我们要在命令行中运行
npm install
来安装这些npm依赖包;安装完成后项目会多出一个叫 node_modules 的文件夹
webpack具体的配置,都在bulid和 config里面,里面的属性我还没有全部弄明白,有时间定会去深究;
webpack+vue2.0项目 (一) vue-cli脚手架的更多相关文章
- webpack vue2.0项目脚手架生成的webpack文件
var path = require('path') var utils = require('./utils') var config = require('../config') var vueL ...
- webpack+vue2.0项目 (二)热加载,vue-router
目录创建好之后,命令行输入 npm run dev 因为在配置文件config/index.js里: dev: { env: require('./dev.env'), port: 8080, aut ...
- webpack vue2.0项目配置文件详解
const path = require('path') const webpack = require('webpack') const HtmlWebpackPlugin = require('h ...
- 13. Vue CLI脚手架
一. Vue CLI 介绍 1. 什么是Vue CLI? Vue CLI 是一个基于 Vue.js 进行快速开发的完整系统.Vue CLI 致力于将 Vue 生态中的工具基础标准化.它确保了各种构建工 ...
- Vue CLI 5 和 vite 创建 vue3.x 项目以及 Vue CLI 和 vite 的区别
这几天进入 Vue CLI 官网,发现不能选择 Vue CLI 的版本,也就是说查不到 vue-cli 4 以下版本的文档. 如果此时电脑上安装了 Vue CLI,那么旧版安装的 vue 项目很可能会 ...
- 从零开始搭建Vue2.0项目(一)之快速开始
从零开始搭建Vue2.0项目(一)之项目快速开始 前言 该样板适用于大型,严肃的项目,并假定您对Webpack和有所了解vue-loader.确保还阅读vue-loader的文档,了解常见的工作流程配 ...
- Webpack+vue2.0如何注册全局组件 (01)
Part 1, 问题: webpack + vue2.0框架中,如何在入口js中注册组件? 就是在一个月以前,匆匆闯入vuejs这个社群,基本了解了vuejs的一些基础特性和语法.笔者兴致勃勃地开始想 ...
- 使用Vue CLI脚手架搭建vue项目
本次是使用@vue/cli 3.11.0版本搭建的vue项目 1. 首先确保自己的电脑上的Node.js的版本是8.9版本或者以上 2. 全局安装vue/cli npm install @vue/cl ...
- vue2.0 项目搭建 和vue 2.0 electron 项目搭建
1.关于electron vue 项目的搭建 全局或者局部安装项目vue: 脚手架指令生成: npm install -g vue-cli vue init simulatedgreg/electro ...
随机推荐
- uniapp自定义简单省市区联动组件
又双叒一个uniapp组件 最近有一个选择地址的需求,就写了一个省市区联动选择器. 选择日期使用的picker,就照着它简单的整了一个,使用网络请求城市数据,还用到了vuex组件数据共享. 本来自己整 ...
- LeetCode--Unique Email Addresses & Hamming Distance (Easy)
929. Unique Email Addresses (Easy)# Every email consists of a local name and a domain name, separate ...
- 消息队列高手课 -笔记-Kafka高性能的几个关键点
总结下kafka 高性能的几个关键点是: 1:使用批量处理的方式 去提升系统的吞吐能力 2:基于磁盘文件高性能的顺序读写的特性来设计存储结构 3:利用操作系统的PageCache 来缓存数据 减少I ...
- 【Hadoop离线基础总结】通过Java代码执行Shell命令
通过Java代码执行Shell命令 需求 在实际工作中,总会有些时候需要我们通过java代码通过远程连接去linux服务器上面执行一些shell命令,包括一些集群的状态管理,执行任务,集群的可视化界面 ...
- SAP ME31K SUBOBJECT_NOT_FOUND
SUBOBJECT_NOT_FOUND 在使用BAPI:BAPI_CONTRACT_CREATE创建协议时报错, 错误位置在此处,子对象没找到 GOOGLE到相关解决方案 事务代码:SLG0 新增对象 ...
- .NET IoC模式依赖反转(DIP)、控制反转(Ioc)、依赖注入(DI)
依赖倒置原则(DIP) 依赖倒置(Dependency Inversion Principle,缩写DIP)是面向对象六大基本原则之一.他是指一种特定的的解耦形式,使得高层次的模块不依赖低层次的模块的 ...
- 053.集群管理-Helm部署及使用
一 Helm概述 1.1 Helm介绍 Helm 是 Kubernetes 的软件包管理工具.包管理器类似 Ubuntu 中使用的apt.Centos中使用的yum 或者Python中的 pip 一样 ...
- OpenStack黄金十年:我与OpenStack的故事
导读:从2010年到2020年,OpenStack项目整整走过了十个春夏秋冬.不管是OpenStack基金会,还是积极参与OpenStack社区的厂商.企业乃至开发者,想必都有肺腑之言想对OpenSt ...
- ql的python学习之路-day6
字节编码: 这一节主要学习的是各种编码模式的相互转换,另外插两句话,今天的心情不是特别好,又没控制好自己的情绪,以后要心存阳光,好好的对待生活和身边的人. 废话不多说了直接贴码: #!/usr/bin ...
- 剑指Offer01之二维数组中查找目标数
剑指Offer之二维数组中查找目标数 题目描述 在一个二维数组中(每个一维数组的长度相等),每一行都是从左到右递增的顺序排序,每一列都是从上到下递增的顺序排序,输入这样一个二维数组和一个整数,判断 ...