使用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  // 等等