Lost MiniCssExtractPlugin, do not parse scss files
mykhailokonst opened this issue · comments
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
- I am willing to submit a pull request for this issue.
Thanks for opening this issue! A maintainer will review it soon.
Hey there @mykhailokonst, do you think you can maybe provide a reproduction so I can help out? Thank you very much!
@tobySolutions , sure. You can comment/uncomment millio.webpack() line to check
Codesandbox link
@tobySolutions, any updates here?
@tobySolutions, any updates here?
Taking a look now, thank you very much @mykhailokonst.
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.
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.