vue项目起步

• Vue.js 的运行过程实际上包含两步。第一步，编译器将字符串模板（template）编译为渲染函数（render），称之为编译过程；第二步，运行时实际调用编译的渲染函数，称之为运行过程。

$ vue init webpack vuetext1--------------------- 安装vue-cli,初始化vue项目的命令
? Target directory exists. Continue? (Y/n) y---------------------找到了vuetext1这个目录是否要继续
? Target directory exists. Continue? Yes
? Project name (vuetext1)---------------------项目的名称（默认是文件夹的名称），ps：项目的名称不能有大写，不能有中文，否则会报错
? Project name vuetext1
? Project description (A Vue.js project)---------------------项目描述，可以自己写
? Project description A Vue.js project
? Author (2515421994@qq.com)---------------------项目创建者
? Author 2515421994@qq.com 
? Vue build (Use arrow keys)--------------------选择打包方式，有两种方式（runtime和standalone），使用默认即可
? Vue build standalone
? Install vue-router? (Y/n) y--------------------是否安装路由，一般都要安装
? Install vue-router? Yes
? Use ESLint to lint your code? (Y/n) n---------------------是否启用eslint检测规则，这里个人建议选no，因为经常会各种代码报错，新手还是不安装好
? Use ESLint to lint your code? No
? Setup unit tests with Karma + Mocha? (Y/n)--------------------是否安装单元测试
? Setup unit tests with Karma + Mocha? Yes
? Setup e2e tests with Nightwatch? (Y/n) y)--------------------是否安装e2e测试 
? Setup e2e tests with Nightwatch? Yes

vue-cli · Generated "vuetext1".
To get started:)--------------------如何开始
 cd vuetext1)--------------------进入你安装的项目
 npm install)--------------------安装项目依赖
 npm run dev)--------------------运行项目
Documentation can be found at https://vuejs-templates.github.io/webpack)--------------------vue-cli官方文档

• Vue build (Use arrow keys) 默认独立时
  standalone，包括编译和支持template选项
  运行时Vue build runtime,运行时不包括模板编译，不支持template选项。render 函数。

• Pick a test runner 选择一个测试运行器

• 单元测试 (unit tests)

• Setup e2e tests with Nightwatch //自动帮我们安装 selenium-server 和 chromedriver 等必要工具
  拓展：现代比较流行的 e2e 测试框架有
  Nightwatch、TestCafe、Protractor、WebdriverIO、Cypress
  

  分层自动化测试

• css-loader 是处理css文件中的url()等

• style-loader 将css插入到页面的style标签

• less-loader 是将less文件编译成css

• sass-loader 是将sass文件编译成css
  —————————————————————————————————————

• npm install mint-ui -S
  再次run 可能遇到
  { parser: "babylon" } is deprecated; we now treat it as { parser: "babel" }.
  解决办法：
  找到你的工程文件夹里的 YourProName\node_modules\vue-loader\lib\template-compiler\index.js

cnpm install node-sass --save-dev
cnpm install sass-loader --save-dev

• VUEX

npm install vuex --save-dev
npm install vuex-persistedstate  --save-dev
import createPersistedState from 'vuex-persistedstate'

const store = new Vuex.Store({
  // ...这样配置表示把VUEX中的所有数据存到localStorage中
 plugins: [createPersistedState()] 
 })