不断更新中……

1、安装node.js

官网：

2、检查node.js和npm是否安装成功

node -v

npm -v

3、设置淘宝镜像（下载速度快）

npm install -g cnpm --registry=https://registry.npm.taobao.org

检查是否设置成功 cnpm -v，出现版本号则成功

4、安装vue-cli脚手架（快速搭建项目）

npm install --global vue-cli

如果安装了cnpm，即淘宝镜像就可以使用cnpm install --global vue-cli

vue --version或者输入 vue -V（注意这里是大写的“V”）检查是否安装成功，出现版本则ok

5、安装webpack-simple模板（webpack太大）

下载完后的文件已经是配置好了的，不然配置麻烦

进入文件夹

cmd中输入E: ，然后enter就进入E盘了E:\job\hvzhao\hv-vue

开始安装webpack

语法：vue init webpack-simple my-project（项目名称）

 

如果已经有文件夹了就直接安装vue init webpack-simple

 

进入目标文件夹，安装依赖 npm install

6、本地开启测试服务器

npm run dev输入后自动弹出8080端口

那么，这个就是我们的脚手架vue-cli，快速构建项目，以后要改东西就在这个页面修改，这个脚手架

已经把webpack配置好了。

webpack目录中package.json，webpack-dev-server --open --hot

运行的时候是npm run dev

开发完要打包的时候就是npm run build

浏览器和开发环境的依赖

7、写项目以及其他介绍

以后都是在src文件夹下面写，其他都是配置文件

 

入口文件和出口文件

 

vue-loader是转换为浏览器能看的文件

 

把es6转换为es5的语法

es6是2015年之后发行的，所以不兼容

 

图片文件修改后缀带hash，浏览器会缓存

hash的作用如果图片变了，那么就能同步修改防止走浏览器缓存了

 

服务器（开一些历史记录之类的）

 

其他性能优化

vue底层-虚拟DOM

HTML-template模板-编译成对象-生成DOM

 

谢了scoped就是局部组件的样式，没写的话就是全局样式