在使用webpack+vue.js构建项目之前，首先得全局安装node，必须在node环境下构建。
1.创建一个基于webpack的项目
创建一个文件夹（如：vuell），使用 （vue init webpack +文件夹名） 命令创建项目目录。
vue init webpack vuell
接下来有几个选项需要选择，这根据项目开发的需求选择是否安装，如下图，可以直接按enter
6DC7D6FD811130CFBEE44D9E938C0DE7.png
创建基于webpack的目录创建成功后，文件夹内容如下：
DE15EF9F02B12E40658EF431C676E63D.png
2. 开启服务器
cd 进入文件夹（vuell）运行一下命令开启服务器
1. cd vuell
2. npm run dev
终端出现下面的服务器端口时，则配置成功
F66727C3BF85ACD5F191B2CAFB712CB3.png
访问http://localhost:8081/本地服务器：会出现vue的界面
A3B0F9D29E2B61234550FD189456797B.png
这样，基于webpack的vue项目就构建成功了，最后来说一下项目完成时，项目的打包
项目打包
一般写项目都是操作src文件夹，html，css，js，image
等都在这写，项目完成时，使用 npm run build 打包项目，此时会生成一个dist!
文件夹，放的便是打包后的项目。
npm run build
8693837C78C3BB38C5AA10355A727C91.png
end----------------
网友评论