/blog/2287074
**********************************************
安装webpack
npmiwebpack--save-dev
如果使用-g参数,可以安装到全局使用,在当前目录安装,可执行文件为 ./node_modules/.bin/webpack
配置webpack.config.js
var path = require('path');
module.exports={
entry: path.resolve(__dirname,'src/index.js'),
output: {
path: path.resolve(__dirname,'build'),
filename:'bundle.js',
},
};
entry为打包的入口文件,output为打包后生成的文件名及路径。
源代码可以编写成多个文件,然后由入口文件调用组装,相互独立的组件最好分别单独写在一个文件中
打包源文件
在当前目录执行webpack 或 ./node_modules/.bin/webpack 命令,就可以将源文件打成生成build/bundle.js文件,网页中直接作用来调用即可
本地开发调试
先安装 webpack-dev-server
npmiwebpack-dev-server--save
在package.json文件中scripts下面添加相应的配置(可以使用npm init来生成package.json文件)
{"scripts": {"build": "webpack","dev": "webpack-dev-server --port 8080 --inline --content-base ./build"}
}
--inline加入该参数可以实现自动刷新,
在当前目录执行 npm run dev,执行完成后,在文件夹build中新建index.html,加入如下代码
tests