webpack.config.js

const webpack = require("webpack");
const path = require("path");
const HtmlWebpackPlugin = require("html-webpack-plugin");
module.exports = {
  entry: [
    "react-hot-loader/patch",
    // 'webpack-dev-server/client?http://localhost:8080',
    // 为 webpack-dev-server 的环境打包代码
    // 然后连接到指定服务器域名与端口

    // "webpack/hot/only-dev-server",
    // 为热替换(HMR)打包好代码
    // only- 意味着只有成功更新运行代码才会执行热替换(HMR)

    "./example/index.js"
  ],
  output: {
    filename: "bundle.js",
    path: __dirname + "/dist"
  },
  devtool: "inline-source-map",
  resolve: {
    extensions: [".js"]
    // alias: {
    //   utils: path.resolve(__dirname, 'src/utils'),
    //   apis: path.resolve(__dirname, 'src/apis'),
    // }
  },
  module: {
    rules: [
      {
        test: /\.jsx?$/,
        use: ["babel-loader"],
        exclude: /node_modules/
      },
      {
        enforce: "pre",
        test: "/.js$/",
        loader: "source-map-loader"
      },
      {
        test: /\.less$/,
        use: [
          {
            loader: "style-loader"
          },
          {
            loader: "css-loader"
          },
          {
            loader: "less-loader"
          }
        ]
      }
    ]
  },
  devServer: {
    port: 8090,
    host: "localhost",
    contentBase: path.resolve(__dirname, "dist"),
    // 输出文件的路径

    publicPath: "/",
    // 和上文 output 的“publicPath”值保持一致
    hot: true
  },
  plugins: [
    new webpack.NamedModulesPlugin(),
    new webpack.HotModuleReplacementPlugin(),
    new HtmlWebpackPlugin({
      title: "Example",
      chunksSortMode: "dependency",
      template: path.resolve(__dirname, "./example/index.ejs")
    })
  ]
};