webpack output

webpack.config.js

const { resolve } = require('path');
const HtmlWebpackPlugin = require('html-webpack-plugin');

module.exports = {
  entry: './src/index.js',
  output: {
    // [name] 默认是 main， 可以写固定值
    // 文件名称（制定名称+目录）
    filename: 'js/[name].js',
    // 输出文件目录（将来所有资源输出的公共目录）
    path: resolve(__dirname, 'build'),
    // 所有资源引入公共路径的前缀 --> 'imgs/a.jpg' --> '/imgs/a.jpg'，比如打包后的html中的引用路径
    // 解释： '/' 当前服务器根目录， 与输出路径没关系
    publicPath: '/',
    // 非入口 chunk 的名称
    chunkFilename: 'js/[name]_chunk.js',
    // library: '[name]',  // 整个库向外暴露的变量名
    // libraryTarget: 'window', // 变量名添加到哪个上 browser
    // libraryTarget: 'global', // 变量名添加到哪个上 node
    // libraryTarget: 'commonjs'
  },
  // 插件
  plugins: [
    new HtmlWebpackPlugin()
  ],
  // 模式 development 开发， production 生产
  mode: 'development'
};