Question

我自己开始学习React，我决定为我创建一个样板文件。我在使用webpack构建项目时遇到了问题。当我在开发模式下运行时，工作正常。当我运行命令'postinstall'来构建生产时，它会生成一个只有几个字节的bundle.js。但是当我在没有参数-p的情况下运行'postinstall'时，它会产生~2MB的捆绑包，生成dev模式时也是如此（显然是因为没有为生产设置）。我没弄清楚为什么生产标志没有正确创建我的包。有人可以帮我解决这个问题吗？

项目位于存储库中： https://github.com/ribeiroguilherme/react-boilerplate-dashboard

webpack.production.config.js文件：

const webpack = require('webpack');
const path = require('path');
const ExtractPlugin = require('extract-text-webpack-plugin');
const CleanPlugin = require('clean-webpack-plugin');


const plugins = [
  new CleanPlugin('dist'),
  new ExtractPlugin('bundle.css'),
  new webpack.optimize.DedupePlugin(),
  new webpack.optimize.UglifyJsPlugin({ minimize: true }),
  new webpack.optimize.AggressiveMergingPlugin(),
  new webpack.DefinePlugin({
    'process.env': {
      NODE_ENV: JSON.stringify('production'),
    },
  }),
];

module.exports = {
  devtool: 'eval',
  debug: false,
  context: __dirname + '/src/client',
  entry: {
    javascript: './index.jsx',
    html: './index.html',
  },
  output: {
    filename: 'bundle.js',
    path: __dirname + '/dist',
  },
  resolve: {
    extensions: ['', '.js', '.jsx', '.json'],
    root: path.resolve(__dirname, './src/client'),
  },
  eslint: {
    configFile: './.eslintrc',
  },
  module: {
    preLoaders: [
      {
        test: /\.jsx?$/,
        exclude: /node_modules/,
        loader: 'eslint-loader',
      },
    ],
    loaders: [
      {
        test: /\.jsx?$/,
        exclude: /node_modules/,
        loaders: ['babel-loader'],
      },
      {
        test: /\.html$/,
        loader: 'file?name=[name].[ext]',
      },
      {
        test: /\.css$/,
        loader: ExtractPlugin.extract('style-loader', 'css-loader'),
      },

    ],
  },
  plugins: plugins,
};

我也很担心，因为捆绑包对于我刚刚开始的项目看起来非常大。任何提示将非常感激。

最好的问候

Webpack -p不能正确创建包

0 个答案: