xolvio / storybook-webpack-federation-plugin

Exposes all the components in your Storybook as Webpack 5 federated components.
MIT License
57 stars 5 forks source link

Webpack Compiler Breaking with `beta16` version of Webpack during `yarn build` #20

Closed jeremiahdir closed 4 years ago

jeremiahdir commented 4 years ago

To reproduce error:

  1. Reproduce steps in issue: https://github.com/xolvio/webpack-federation-storybook-design-systems-demo/issues/5#issuecomment-644345501

Error occurs with and without adding nohoist option to webpack

Error message during yarn build for the DesignSystem app

Starting type checking service...
0% compiling(node:35361) UnhandledPromiseRejectionWarning: TypeError: The 'compilation' argument must be an instance of Compilation
    at Function.getCompilationHooks (/Users/jdir/Projects/Examples/webpack-federation-storybook-design-systems-demo/DesignSystem/node_modules/webpack/lib/javascript/JavascriptModulesPlugin.js:116:10)
    at compiler.hooks.compilation.tap.compilation (/Users/jdir/Projects/Examples/webpack-federation-storybook-design-systems-demo/DesignSystem/node_modules/terser-webpack-plugin/dist/index.js:419:67)
    at SyncHook.eval [as call] (eval at create (/Users/jdir/Projects/Examples/webpack-federation-storybook-design-systems-demo/DesignSystem/node_modules/tapable/lib/HookCodeFactory.js:19:10), <anonymous>:91:1)
    at SyncHook.lazyCompileHook (/Users/jdir/Projects/Examples/webpack-federation-storybook-design-systems-demo/DesignSystem/node_modules/tapable/lib/Hook.js:154:20)
    at Compiler.newCompilation (/Users/jdir/Projects/Examples/webpack-federation-storybook-design-systems-demo/DesignSystem/node_modules/@storybook/core/node_modules/webpack/lib/Compiler.js:631:26)
    at hooks.beforeCompile.callAsync.err (/Users/jdir/Projects/Examples/webpack-federation-storybook-design-systems-demo/DesignSystem/node_modules/@storybook/core/node_modules/webpack/lib/Compiler.js:667:29)
    at AsyncSeriesHook.eval [as callAsync] (eval at create (/Users/jdir/Projects/Examples/webpack-federation-storybook-design-systems-demo/DesignSystem/node_modules/tapable/lib/HookCodeFactory.js:33:10), <anonymous>:6:1)
    at AsyncSeriesHook.lazyCompileHook (/Users/jdir/Projects/Examples/webpack-federation-storybook-design-systems-demo/DesignSystem/node_modules/tapable/lib/Hook.js:154:20)
    at Compiler.compile (/Users/jdir/Projects/Examples/webpack-federation-storybook-design-systems-demo/DesignSystem/node_modules/@storybook/core/node_modules/webpack/lib/Compiler.js:662:28)
    at readRecords.err (/Users/jdir/Projects/Examples/webpack-federation-storybook-design-systems-demo/DesignSystem/node_modules/@storybook/core/node_modules/webpack/lib/Compiler.js:321:11)
    at Compiler.readRecords (/Users/jdir/Projects/Examples/webpack-federation-storybook-design-systems-demo/DesignSystem/node_modules/@storybook/core/node_modules/webpack/lib/Compiler.js:529:11)
    at hooks.run.callAsync.err (/Users/jdir/Projects/Examples/webpack-federation-storybook-design-systems-demo/DesignSystem/node_modules/@storybook/core/node_modules/webpack/lib/Compiler.js:318:10)
    at _err0 (eval at create (/Users/jdir/Projects/Examples/webpack-federation-storybook-design-systems-demo/DesignSystem/node_modules/tapable/lib/HookCodeFactory.js:33:10), <anonymous>:11:1)
    at run (/Users/jdir/Projects/Examples/webpack-federation-storybook-design-systems-demo/DesignSystem/node_modules/fork-ts-checker-webpack-plugin/lib/index.js:204:13)
    at AsyncSeriesHook.eval [as callAsync] (eval at create (/Users/jdir/Projects/Examples/webpack-federation-storybook-design-systems-demo/DesignSystem/node_modules/tapable/lib/HookCodeFactory.js:33:10), <anonymous>:7:1)
    at AsyncSeriesHook.lazyCompileHook (/Users/jdir/Projects/Examples/webpack-federation-storybook-design-systems-demo/DesignSystem/node_modules/tapable/lib/Hook.js:154:20)
(node:35361) UnhandledPromiseRejectionWarning: Unhandled promise rejection. This error originated either by throwing inside of an async function without a catch block, or by rejecting a promise which was not handled with .catch(). (rejection id: 2)
(node:35361) [DEP0018] DeprecationWarning: Unhandled promise rejections are deprecated. In the future, promise rejections that are not handled will terminate the Node.js process with a non-zero exit code.

Upgrading to beta17 version of Webpack fixes this but creates an issue with the consuming app here: https://github.com/xolvio/webpack-federation-storybook-design-systems-demo/issues/8

jeremiahdir commented 4 years ago

UPDATE: fixed by commenting out the typecheck at webpack-federation-storybook-design-systems-demo/App/node_modules/webpack/lib/javascript/JavascriptModulesPlugin.js Line 115

        /* if (!(compilation instanceof Compilation)) {
            throw new TypeError(
                "The 'compilation' argument must be an instance of Compilation"
            );
        } */