webpack知识点总结
webpack环境安装
全局环境安装
npm install webpack-cli -g
npm install webpack -g
mac上安装webpack报错解决方法Hit error EACCES: permission denied, mkdir '/usr/local/lib/node_modules/webpack
解决办法:
sudo npm install webpack -g
或
sudo npm install webpack -g --unsafe-perm=true --allow-root
或
sudo npm install webpack -g --unsafe-perm=true
webpack概述
webpack 的版本更迭
入口文件配置
const path = require("path"); module.exports = { entry: "./src/app.js", output: { path: path.resolve(_dirname,"dist"), filename: "app.js" } };
HtmlWebpackPlugin 安装配置
使用命令:
yarn add html-webpack-plugin
配置:
const HtmlWebpackPlugin = require('html-webpack-plugin'); ...... plugins: [ new HtmlWebpackPlugin({ template: './src/index.html' }) ]
babel安装配置
使用命令:
yarn add babel-core@6.26.0 babel-preset-env@1.6.1 babel-loader@7.1.2 --dev
配置:
module: { rules: [ { test: /\.js$/, exclude: /(node_modules)/, use: { loader: 'babel-loader', options: { presets: ['env'] } } } ] },
未完待续...