vue + webpack 构建项目

1、vue+webpack环境搭建步骤

1.1、去官网安装node.js。下载安装包之后直接点击安装即可。测试安装成功的界面如下：

1.2、利用npm安装webpack  命令行语句为 npm install webpack -g  。测试安装成功的界面如下：

1.3、下面就是安装淘宝镜像

1.4、接下来就是全局安装vue-cli。需要注意的是使用npm安装vue-cli的时候时间很久，可能会超过两个小时

安装语句为：npm install --global vue-cli

 

1.5、创建一个基于webpack模板的新项目

命令行语句为vue init webpack my-project  (其中my-project为文件名称,并且文件名只能是小写字母)。在创建模板新项目的时候需要进入到指定的文件夹下面去。

命令执行完成后可以看到在my-project的文件夹下面多了如下的内容：

 

1.6、安装依赖项。安装完成后会新增一个node_modules文件夹

命令行语句为：

cd my-project

npm install

npm run dev

成功了之后你会看到如下界面：

 

 

 

 

以上就是如何搭建vue+webpack的打包环境

 

2、下面我来说说在搭建环境的过程中踏过的坑

2.1、在安装webpack的时候显示unable to verify the first certificate 证书问题

 

解决方案：把证书的验证关掉，用完之后再打开

 

关掉证书的验证：

npm config set strict-ssl false

 

打开证书的验证：

npm config set strict-ssl true

 

2、执行命令行vue init webpack my-project 报错

 

解决方法：win7下需要配置环境变量