WebPack搭建vue项目

手动搭建vue项目

1. 创建文件夹 vue-pro,进入文件夹进行npm包管理初始化

   npm init

2. 按照终端要求进行配置项目的page.json文件

   

3. 配置完成会发现文件夹内有了一个page.json文件

   

4. 在项目本地安装webpack打包工具，进行项目内模块化开发

   npm install webpack --save-dev

5. 在项目内进行创建文件，并测试webpack打包工具，这里对webpack进行配置，实现自定义npm run serve命令直接将文件进行打包

   

   这里配置了 npm run serve命令指向调用webpack进行项目的打包

   

6. 初始化index.html里面引入dist的文件

   

7. 然后在页面内可以发现main.js的运行

   

8. 然后进行vue项目文件的配置，配置webpack，进行将vue文件，css文件和其他js文件的配置打包【详细配置内容查看代码  -> 码云地址链接】