使用Vue-cli快速搭建webpack项目

使用NPM快速搭建Vue Webpack项目

• 第一步 下载更新npm

Windows下使用如下命令全局安装：

npm i -g n //或者 npm install -g n

安装好之后使用命令:

node -v //以及
npm -v

*如果能查到版本号说明安装成功

• 第二步 安装vue-cli (脚手架)

使用如下命令全局安装：

npm i -g vue-cli

安装好之后输入：

vue -v

*如果能查到版本号说明安装成功

• 第三步 进入项目存放目录并生成项目

使用如下命令：

vue init webpack projectName  //projectName是你项目名称

此时模板项目就会下载，之后会出现几个让你确认的选项，输入y（yes）回车即可，如下图所示：

如图中标注一样，安装完成后会自动提示是否使用npm install命令，回车就会自动安装项目依赖，当然你也可以随后在项目根目录下手动安装项目依赖

• 第四步 启动项目

输入命令：

npm run dev

补充一个小贴士（针对于windows）：如果日后不输入命令启动项目，就在项目根目录下新建一个.bat文件：先新建一个txt然后编辑npm run dev保存，将文件后缀修改为.bat。如下图：以后双击就可以启动项目了

• 第五步 发布项目

先使用命令：

npm run build

会在项目根目录下生产一个dist文件夹，然后将文件夹拷到服务器上就可以了
最后补充一张流程图，来完善一下刚刚的步骤：

• 第六步 安装开发依赖

npm i axios --save  // 等等