webpack入门

1 创建项目文件夹 : webpack_test
2 创建文件 package.json
3 安装webpack
npm install webpack -g npm install webpack --save-dev

webpack 只能打包js 或 json 文件，要打包其他类型的文件，需要用到打包工具loader
webpack 打包js文件
1 项目下新建src/js/entry.js文件，文件名自己定义
2 执行 webpack src/js/entry.js dist/js/bundle.js 命令， 表示将此js文件打包到dist/js/bundle.js文件下，这个文件夹系统会新建出来
webpack 打包json 数据
新建 test.json文件，里面写入数据，执行命令与打包js相似

webpack.config.js配置
新建webpack.config.js文件，配置该文件
const path=require('path');
module.exports = {
entry: './src/js/entry.js',
output:{

    filename:'bundle.js',
    path: path.resolve(_dirname,'dist/js/')

}
}

当配置好这个文件后，直接执行webpack命令，就能将所有需要打包的文件打包到dist/js/bundle.js里

接上面添加如下代码： 热加载配置
devServer:{

contentBase: 'dist/'  //webpack-dev-server默认服务于根路径下的index，添加这句表示服务于dist目录下的

}

使用插件
常用插件 : html-webpack-plugin 根据模板html生成引入script的页面 clean-webpack-plugin 清除dist文件夹