vue-cli脚手架的安装使用及个别问题解决

安装node.js

      vue-cli脚手架的安装需要使用node.js的环境，所以安装前必须安装好node

       node.js官网：点这里

使用cnpm（本处是使用淘宝镜像）

      由于在下载某些插件、引擎的时后，下载的速度比较慢，所以我使用了淘宝镜像，这样下载比较快。

       淘宝镜像官网：点这里

   使用说明:

       在命令行执行：npm install -g cnpm --registry=https://registry.npm.taobao.org

       查看是否安装成功可以使用：cnpm -v

   可能会出现的问题：



   解决方法：

        开始->Window PowerShell->以管理员身份运行


在弹出的Window PowerShell命令行窗口中执行set-ExecutionPolicy RemoteSigned

       输入A,回车就行了。

       再次测试一下：cnpm -v

安装vue-cli脚手架

        为了下载速度快点，以下都使用cnpm来下载。

        在命令行执行：cnpm install -g @vue/cli

vue-cli脚手架的使用

      安装完脚手架后就可以创建项目了

1、普通直接创建：vue create <项目名>

2、创建基于webpack的项目:
创建基于webpack的还需要安装webpack和webpack-cli
cnpm install webpack -g

cli:cnpm install webpack-cli -D
创建项目:vue init webpack <项目名>


   问题：执行这句命令可能遇到的问题

   解决方法：

       按照它所给的命令行安装即可。（为了快速，使用cnpm）

   项目选项翻译：

信息	中文翻译	填写示例或选择	默认
Project name	项目名称	mobao	默认为创建项目时的项目名
Project description	项目介绍	只是一个测试项目	默认为空
Author	项目作者	张三	默认为空
Vue build (Use arrow keys)	Vue的构建(编译模式)	Runtime + Compiler: recommended for most users	一般选择第一个
Install vue-router?	是否安装路由	y	根据项目所需而选，一般都是确定安装
Use ESLint to lint your code?	是否使用ESLint 来检查代码规范	根据项目所需而选，一般都是确定使用
Pick an ESLint preset	选择一个ESLint预设	一般选择Standard (https://github.com/standard/standard)	如果没有githoub账号，选择none (configure it yourself)
Set up unit tests	是否设置单元测试	一般n	根据需要而定
Setup e2e tests with Nightwatch?	是否使用Nightwatch设置e2e测试	一般n	根据需要而定
Should we run npm install for you after the project has been created? (recommended)	创建项目后，我们应该为您运行npm install吗？ （推荐的）	一般选 Yes, use NPM	根据需要而定

   运行项目

       创建完之后cd <项目名>

       在命令行执行即可运行起项目(不需要下载就使用npm)：npm run dev

      在浏览器上输入http://localhost:8080即可进到项目的页面了。


3、通过页面创建：vue ui

插件及引擎下载

1、通过命令行下载安装:cnpm install <插件名称> -S

2、在vue ui的页面下载安装:

小妙招：

       迅速cd到项目中命令行：进到项目目录，再shift+右键