11

これは、私が今まで遭遇した webpack の最も奇妙な問題の 1 つに違いありません...

このバンドルの内訳を確認してください: ここに画像の説明を入力 反応 116.01KB - 十分に公平

react-dom 533.24KB - 真剣に WTF

依存関係が破損している可能性があると思いましたが、node_modules を削除して再インストールしても効果はありません。それは webpack がそれをバンドルする方法に関係していると思いますが、アイデアがありません。私が .js インポートを処理している方法は、かなり標準的なものです。

// webpack.config.js
const path = require('path');
// const BundleAnalyzerPlugin = require('webpack-bundle-analyzer').BundleAnalyzerPlugin;
const ExtractTextPlugin = require('extract-text-webpack-plugin');
const Dashboard = require('webpack-dashboard');
const DashboardPlugin = require('webpack-dashboard/plugin');

const dashboard = new Dashboard();

module.exports = {
  context: path.join(__dirname, 'src'),
  entry: {
    bundle: './index.js',
  },
  output: {
    filename: 'bundle.js',
    path: path.join(__dirname, 'build'),
  },
  module: {
    rules: [
      {
        test: /\.html$/,
        use: 'file-loader?name=[name].[ext]',
      },
      {
        test: /.scss$/,
        use: ExtractTextPlugin.extract({
          fallback: 'style-loader',
          use: [
            'css-loader',
            'postcss-loader',
          ],
        }),
      },
      {
        test: /\.js$/,
        exclude: /node_modules/,
        use: 'babel-loader',
      },
    ],
  },
  plugins: [
    // new BundleAnalyzerPlugin(),
    new ExtractTextPlugin('styles.css'),
    new DashboardPlugin(dashboard.setData),
  ],
  devServer: {
    quiet: true,
  },
};

// .babelrc
{
  "presets": [
    "react",
    "es2015"
  ],
  "plugins": ["transform-object-rest-spread"]
}
4

4 に答える 4