Vue-cil创建项目

一、搭建工作环境环境

　　1、从node.js官网下载相应版本进行安装即可 https://nodejs.org/zh-cn/download/，安装完成后在命令行输入  node -v 如果可以查询到版本号，说明安装成功。

　　2、node自带npm包管理工具，在命令行输入  npm -v 如果查询到版本号，说明正常

　　3、npm下载太慢，需要下载国内淘宝镜像： npm install -g cnpm --registry = https://registry.npm.taobao.org，安装完成后输入 cnpm -v 显示版本号，说明正常

　　4、安装webpack（包管理工具），命令行输入  cnpm i webpack -g   ，-g说明是全局安装

　　5、安装vue.cli 3.X脚手架，命令行输入 cnpm i @vue-cli -g      不选择版本号，将下载最新的稳定版本，输入vue -V 可查看版本

二、创建项目 

　　1、命令行 进入项目目录

　　2、创建项目：vue create 项目名称（不要有中文），选择manually select进行选择

 

 

 

　　3、常见的项目选择如下：

 

 

 

 

 

 

 

 

对于每一项的功能，我做一个简单的描述：

• Babel 主要是对es6语法转换成兼容的js （选上）
• TypeScript 支持使用TypeScript语法来编写代码
• Progressive Web App (PWA) Support [把网页做的更像原生app]
• Router 支持vue路由配置插件（一般都会选择）
• Vuex 支持vue程序状态管理模式 (一般都会选择)
• CSS Pre-processors 支持css预处理器 （一般都会选择）
• Linter / Formatter 支持代码风格检查和格式化 （选上）
• Unit Testing 单元测试
• E2E Testing E2E测试

　

4.选择完成之后回车 这里我们选择3.x的

 

 

 

5、完成之后回车 出现以下界面

 

 

 

 这里选择yes，然后选择In dedicated config files

6、完成之后回车 出现以下界面

 

 

 选择y

 

7、完成之后回车 出现以下界面

 

 

 根据界面提示完成相关操作

　　8、创建完成后，进入项目目录，输入npm run serve 即可启动项目，登陆后界面如下图

 

 

 

 

 

 
 

搜索

复制