gajus / prepack-webpack-plugin

A webpack plugin for prepack.
Other
1.04k stars 46 forks source link

Invariant Violation #26

Open LeoIannacone opened 7 years ago

LeoIannacone commented 7 years ago

Not sure what causes this error, I'm not able to build using this plugin:

Invariant Violation
    at invariant (/my_project/node_modules/prepack/src/invariant.js:15:15)
    at new Serializer (/my_project/node_modules/prepack/src/serializer/serializer.js:64:5)
    at prepack (/my_project/node_modules/prepack/src/prepack-standalone.js:36:20)
    at Compilation.compilation.plugin (/my_project/node_modules/prepack-webpack-plugin/src/PrepackPlugin.js:58:35)
    at Compilation.applyPluginsAsyncSeries (/my_project/node_modules/tapable/lib/Tapable.js:142:13)
    at self.applyPluginsAsync.err (/my_project/node_modules/webpack/lib/Compilation.js:631:10)
    at Compilation.applyPluginsAsyncSeries (/my_project/node_modules/tapable/lib/Tapable.js:131:46)
    at sealPart2 (/my_project/node_modules/webpack/lib/Compilation.js:627:9)
    at Compilation.applyPluginsAsyncSeries (/my_project/node_modules/tapable/lib/Tapable.js:131:46)
    at Compilation.seal (/my_project/node_modules/webpack/lib/Compilation.js:575:8)

How can I provide more info?

ashtonlance commented 7 years ago

I'm getting the same error

Here's my config

var fs = require('fs')
var path = require('path')
var utils = require('./utils')
var webpack = require('webpack')
var config = require('../config')
var merge = require('webpack-merge')
var baseWebpackConfig = require('./webpack.base.conf')
var CopyWebpackPlugin = require('copy-webpack-plugin')
var HtmlWebpackPlugin = require('html-webpack-plugin')
var ExtractTextPlugin = require('extract-text-webpack-plugin')
var OptimizeCSSPlugin = require('optimize-css-assets-webpack-plugin')
var SWPrecacheWebpackPlugin = require('sw-precache-webpack-plugin')
const PrepackWebpackPlugin = require('prepack-webpack-plugin').default

var env = process.env.NODE_ENV === 'testing'
  ? require('../config/test.env')
  : config.build.env

var webpackConfig = merge(baseWebpackConfig, {
  module: {
    rules: utils.styleLoaders({
      sourceMap: config.build.productionSourceMap,
      extract: true
    })
  },
  devtool: config.build.productionSourceMap ? '#source-map' : false,
  output: {
    path: config.build.assetsRoot,
    filename: utils.assetsPath('js/[name].[chunkhash].js'),
    chunkFilename: utils.assetsPath('js/[id].[chunkhash].js')
  },
  plugins: [
    // http://vuejs.github.io/vue-loader/en/workflow/production.html
    new webpack.DefinePlugin({
      'process.env': env
    }),
    new webpack.optimize.AggressiveMergingPlugin(),
    new PrepackWebpackPlugin({}),
    new webpack.optimize.UglifyJsPlugin({
      compress: { warnings: false },
      comments: false,
      sourceMap: true
    }),
    new webpack.optimize.OccurrenceOrderPlugin(),
    // extract css into its own file
    new ExtractTextPlugin({
      filename: utils.assetsPath('css/[name].[contenthash].css')
    }),

    // Compress extracted CSS. We are using this plugin so that possible
    // duplicated CSS from different components can be deduped.
    new OptimizeCSSPlugin({
      cssProcessorOptions: {
        safe: true
      }
    }),
    // generate dist index.html with correct asset hash for caching.
    // you can customize output by editing /index.html
    // see https://github.com/ampedandwired/html-webpack-plugin
    new HtmlWebpackPlugin({
      filename: process.env.NODE_ENV === 'testing'
        ? 'index.html'
        : config.build.index,
      template: 'index.html',
      inject: true,
      minify: {
        removeComments: true,
        collapseWhitespace: true,
        removeAttributeQuotes: true
        // more options:
        // https://github.com/kangax/html-minifier#options-quick-reference
      },
      // necessary to consistently work with multiple chunks via CommonsChunkPlugin
      chunksSortMode: 'dependency',
      serviceWorkerLoader: `<script>${fs.readFileSync(path.join(__dirname,
        './service-worker-prod.js'), 'utf-8')}</script>`
    }),

    // split vendor js into its own file
    new webpack.optimize.CommonsChunkPlugin({
      name: 'vendor',
      minChunks: function (module, count) {
        // any required modules inside node_modules are extracted to vendor
        return (
          module.resource &&
          /\.js$/.test(module.resource) &&
          module.resource.indexOf(
            path.join(__dirname, '../node_modules')
          ) === 0
        )
      }
    }),
    // extract webpack runtime and module manifest to its own file in order to
    // prevent vendor hash from being updated whenever app bundle is updated
    new webpack.optimize.CommonsChunkPlugin({
      name: 'manifest',
      chunks: ['vendor']
    }),
    // copy custom static assets
    new CopyWebpackPlugin([
      {
        from: path.resolve(__dirname, '../static'),
        to: config.build.assetsSubDirectory,
        ignore: ['.*']
      }
    ]),
    // service worker caching
    new SWPrecacheWebpackPlugin({
      cacheId: 'chattanosy',
      filename: 'service-worker.js',
      staticFileGlobs: ['dist/**/*.{js,html,css}'],
      minify: true,
      stripPrefix: 'dist/'
    })
  ]
})

if (config.build.productionGzip) {
  var CompressionWebpackPlugin = require('compression-webpack-plugin')

  webpackConfig.plugins.push(
    new CompressionWebpackPlugin({
      asset: '[path].gz[query]',
      algorithm: 'gzip',
      test: new RegExp(
        '\\.(' +
        config.build.productionGzipExtensions.join('|') +
        '))
      ),
      threshold: 10240,
      minRatio: 0.8
    })
  )
}

if (config.build.bundleAnalyzerReport) {
  var BundleAnalyzerPlugin = require('webpack-bundle-analyzer').BundleAnalyzerPlugin
  webpackConfig.plugins.push(new BundleAnalyzerPlugin())
}

module.exports = webpackConfig)
only-cliches commented 7 years ago

Ditto, my webpack config:

const path = require('path');
const webpack = require("webpack");
const AssetsPlugin = require('assets-webpack-plugin');
const PrepackWebpackPlugin = require('prepack-webpack-plugin').default;

var options = {
    entry: {
        app: [path.join(__dirname, 'src', 'business_client.tsx')],
        app2: [path.join(__dirname, 'src', 'consumer_client.tsx')],
        app3: [path.join(__dirname, 'src', 'signage_client.tsx')],
        app4: [path.join(__dirname, 'src', 'menu_client.tsx')],
        vendor: [
            "react",
            "@uifabric/utilities",
            "@microsoft/load-themed-styles",
            "react-router",
            "react-dom",
            "react-router-dom",
            "history",
            "nano-sql-stream",
            "nano-sql"
        ],
        charts: [
            "recharts"
        ]
    },
    output: {
        path: path.join(__dirname, 'www', 'public'),
        filename: '[name].js',
        libraryTarget: 'umd',
        umdNamedDefine: true
    },
    resolve: {
        extensions: ['.js', '.ts', '.tsx', '.scss', ".css"]
    },
    plugins: [
        new PrepackWebpackPlugin(),
        new webpack.optimize.CommonsChunkPlugin("vendor"),
        new AssetsPlugin({ filename: 'www/assets.json' })
    ],
    module: {
        loaders: [{
            test: /\.ts$|\.tsx$/,
            loader: 'ts-loader'
        }, {
            test: /\.scss$/,
            use: [{
                loader: "style-loader"
            }, {
                loader: "css-loader"
            }, {
                loader: "sass-loader"
            }]
        }, { test: /\.css$/, loader: "style-loader!css-loader" }]
    }
};

switch (process.env.NODE_ENV) {
    case "production":
        options.output.filename = '[name].[chunkhash].min.js';
        options['plugins'] = options['plugins'].concat([
            new webpack.optimize.UglifyJsPlugin(),
            new webpack.LoaderOptionsPlugin({
                minimize: true,
                debug: false
            })
        ]);
        break;
}

module.exports = options;
gajus commented 7 years ago

I'd start from looking at whats at /my_project/node_modules/prepack/src/invariant.js:15:15 line. It is coming from prepack.

Invariant violation means that some expected condition was not met.

dylan-kerr commented 7 years ago

I also had this issue, and resolved it by passing { prepack: { serialize: true } } as PrepackWebpackPlugins config object.

It looks like prepack-standalone has changed, as the serialize option is the default when running from the prepack CLI.