aidenybai / million

Optimize React performance and make your React 70% faster in minutes, not months.
https://million.dev
MIT License
15.89k stars 558 forks source link

Lost MiniCssExtractPlugin, do not parse scss files #1018

Closed mykhailokonst closed 2 months ago

mykhailokonst commented 2 months ago

What version of million are you using?

0.0.73

Are you using an SSR adapter? If so, which one?

None

What package manager are you using?

npm

What operating system are you using?

Mac

What browser are you using?

Chrome

Describe the Bug

Versions:

"webpack": "5.91.0", "webpack-bundle-analyzer": "4.10.1", "webpack-cli": "5.1.4", "webpack-dev-server": "5.0.4", "mini-css-extract-plugin": "2.8.1", "react": "18.2.0", "react-dom": "18.2.0",

After adding Million Lint, npm run start failed. It tells that I forgot to add MiniCssExtractPlugin in plugins section in webpack, but it exists there, and it build well after removing millionlint plugin.

`plugins: [ new ForkTsCheckerWebpackPlugin({ typescript: { configFile: path.join(__dirname, '..', 'tsconfig.json'), }, }), // Combine all generated styles into a single bundle.css file new MiniCssExtractPlugin({ filename: server ? '[name].css' : '[name].[contenthash].css' }), new HtmlWebpackPlugin({ // Do not inject references to the webpack generatad js/css bundles. It will be done // manually in the template inject: false,

    // Add hashes to the bundle references to invalidate caching
    hash: true,

    // ejs template to use. Search following this order:
    // - a config/index.html.ejs file inside the project
    // - the framework's default template
    template: findFile('<root>/config/index.html.ejs', '<framework>/index.html.ejs'),

    // Name of the generated template file
    filename: 'index.html',

    // Initial application state set as global window variables. Only available in server mode.
    state: server ? requireFile('<root>/config/server/state.js', '<framework>/server/state.js') : {},
  }),

  // Generate a GO index.html.tmpl template for standalone deploys
  !server &&
    new HtmlWebpackPlugin({
      inject: false,
      hash: true,
      template: findFile('<root>/config/index.html.ejs', '<framework>/index.html.ejs'),
      filename: 'index.html.tmpl',
    }),

  // Tell webpack not to require jQuery. If a project uses jQuery it must include a
  // <script> tag in the template
  new webpack.ProvidePlugin({
    $: 'jquery',
    jQuery: 'jquery',
    // Node.js polyfills
    process: 'process/browser',
  }),

  // Prune from the bundle the unneeded validator-js locales.
  // Framework supported "es" and "en" locales are bundled by default
  new webpack.ContextReplacementPlugin(/validatorjs[\/\\]src[\/\\]lang/, /es|en/),

  // Output gzip version of the assets
  !server && new CompressionPlugin({}),
  new BundleAnalyzerPlugin(),
  MillionLint.webpack(),
],`

Errors:

ERROR in ./shared/modules/status-history/status-history.scss Module build failed (from ../node_modules/mini-css-extract-plugin/dist/loader.js): Error: You forgot to add 'mini-css-extract-plugin' plugin (i.e.{ plugins: [new MiniCssExtractPlugin()] }`), please read https://github.com/webpack-contrib/mini-css-extract-plugin#getting-started at Object.pitch (**/node_modules/mini-css-extract-plugin/dist/loader.js:77:14) @ ./modules.tsx 11:0-86 19:104-139 @ ./main.tsx 25:0-36 42:238-245

webpack 5.91.0 compiled with 461 errors in 54839 ms`

What's the expected result?

Webpack build should be successful.

Link to Minimal Reproducible Example

-

Participation

github-actions[bot] commented 2 months ago

Thanks for opening this issue! A maintainer will review it soon.

tobySolutions commented 2 months ago

Hey there @mykhailokonst, do you think you can maybe provide a reproduction so I can help out? Thank you very much!

mykhailokonst commented 2 months ago

@tobySolutions , sure. You can comment/uncomment millio.webpack() line to check Codesandbox link

mykhailokonst commented 2 months ago

@tobySolutions, any updates here?

tobySolutions commented 2 months ago

@tobySolutions, any updates here?

Taking a look now, thank you very much @mykhailokonst.

tobySolutions commented 2 months ago

I have taken a look and I think I need to inform the team of this issue so they can take a look. I'll pass on your reproduction to the team and I'll get back to you @mykhailokonst. Thank you.

github-actions[bot] commented 2 months ago

This issue has been automatically marked as stale because it has not had recent activity. It will be closed if no further activity occurs within the next 7 days.