一.pageage.json
注意点:
1/在生成该文件的时候,一定要注意文件夹不能包含特殊和中文字符
执行命令 :
npm init -y
2/pageage.json文件内容:
{ "name": "meetwebpack", //名字 "version": "1.0.0", //版本 "description": "", //描述 "main": "index.js", //入口文件 "scripts": { //执行脚本 "test": "echo "Error: no test specified" && exit 1", "build":"webpack" }, "author": "", //作者 "license": "ISC", "dependencies": { //开发时依赖 "webpack": "^3.6.0" }, "dependencies":{ //运行时依赖 } }
2.webpack.config.js
注意点:
1/先安装环境
(1)依赖于node环境
(2)运行命令 (这里的3.6.0主要是因为与脚手架2.0匹配)
npm install webpack@3.6.0 -g
(3)开始配置文件
dist文件:用于存放之后打包的文件
src:用于存放开发的源文件
main.js 项目入口文件
mathUtils.js 定义相关函数内容
展示用的首页:index.html
打包语句:webpack ./src/main.js ./dist/bundle.js
2/webpack.config.js文件
const path = require("path"); module.exports = { entry: "./src/main.js", output: { path: __dirname + "/dist", filename: "bundle.js", }, };
执行命令: webpack 即可 (若是有多个配置文件:webpack aaa.config.js)