Webpack：未定义窗口

Question

我正在尝试将我的课程之一介绍给global。 但是eslint告诉我“窗口”是未定义的，这不是eslint的问题，因为即使关闭eslint，我的班级仍然无法访问。

这是我的webpack配置：

export default {
  output: {
    filename: 'dist/client-bundle.js',
  },
  devtool: 'source-map',
  module: {
    loaders: [
      {
        test: /\.jsx?$/,
        loader: 'babel-loader',
        exclude: [/node_modules/],
      },
    ],
  },
  resolve: {
    extensions: ['', '.js', '.jsx'],
  },
};

我还在package.json设置了"env": { "browser": true } ，我可以在client-bundle.js看到window.myClass = className ，但仍然无法正常工作。

Answer 1

更改配置以解决此问题，也是全局变量不可访问的原因之一是使用webpack-dev-server 。

export default {
  output: {
    filename: 'dist/client-bundle.js',
    libraryTarget: 'var',
    library: 'className'
  },
  devtool: 'source-map',
  module: {
    loaders: [
      {
        test: /\.jsx?$/,
        loader: 'babel-loader',
        exclude: [/node_modules/],
      },
    ],
  },
  resolve: {
    extensions: ['', '.js', '.jsx'],
  },
};