【Vue】使用NPM方法构建项目步骤

step1、全局安装 vue-cli，输入命令（安装一次即可）：

【cnpm install --global vue-cli】

 

step2、进入指定文件夹，创建一个基于 webpack 模板的新项目，输入命令：

【d:】

【vue init webpack myFirstVueProject】

接下来一路回车，静静等待就好。

注：上面的“myFirstVueProject”是项目名称，可以自己定。执行完这个步骤之后，稍等片刻，即可在D盘中看到myFirstVueProject项目。

说明：在之前编写此文章时，项目名称是大写时，是可以成功创建项目的。但是今天（2019年07月11日）再次创建时，发现出现下面错误：

提示："name can no longer contain capital letters."即名称不能再包含大写字母。所以记得用小写字母命名项目名称！！！

 

step3、然后需要进行一些配置，默认回车即可。

 

step4、进入项目，安装并运行，输入命令：

【cd myFirstVueProject】

【npm install】：项目第一次时安装即可，之后可以直接运行下一步

【npm run dev】：启动本地服务器

然后出现successfully即表示安装成功，例如下图这样的：

 

step5、成功执行以上命令后访问 【http://localhost:8080/】，输出结果如下图所示：

总结：其实也就上面5个命令行即可构建项目，也很简单，傻瓜式操作。

Vue使用NPM安装，可以参考Vue菜鸟教程中“Vue.js安装”的第3条：http://www.runoob.com/vue2/vue-install.html

 

 

 

 

在用脚手架安装时，需要用到一些命令，在此记录一下：

1、查看npm版本：【npm -v】

2、更新npm版本：【npm install npm -g】

3、查看node版本：【node -v】

注：没有安装node的同学请到官网(https://nodejs.org/en/download/)下载安装。安装了node的话，npm也会一起安装好了。
安装成功后在命令行查看node版本，如果有版本号则说明安装成功。

4、安装依赖：【npm install】

5、进入D盘：输入【d:】回车即可