环境搭建
node(8.11.2)&&npm(6.1.0)
使用npm 的npx命令
基础入门
建立项目文件夹在文件夹下安装webpack(4.12.0)还有webpack-cli
npm init -y//创建包文件
npm install -D webpack webpack-cli //局部安装(全局已经装了的)-D大写的才能配置到devdependencies
devdependencies和dependencies的区别
devdependencies里的是开发时用到的工具(非必须的)
dependencies的配置是项目需要使用到的依赖(必须要有的-->如jQuery等)
开始项目
新建index.html 、index.js、main.js 三个文件
index.js 导出相关对象(函数、变量等):module.exports={a,b,c} //注意:“=”“{}”是经常出错的点
接着在 main.js 中导入模块 index.js
main.js 导入模块:var index=require("./index") //main和index的路径是同一目录下的
再将 main.js 打包成 main.bundle.js //main.bundle.js 是不存在的,打包之后生成的文件
打包
npx webpack main.js -o main.bundle.js --mode development
-o指定输出文件
--mode development 指定为生产模式
导入
index.html 只有引入main.bundle.js即可
启动
npx http-server
避免遗忘,特此撰文!!!