Open saidarshan27 opened 3 hours ago
I am using a package called plyr-react for video player support in an application. plyr-react exports a plyr.css file, which is not being included in my final bundle even after being referenced in the entry file.
plyr-react
plyr.css
Here is my rspack config
module.exports = { mode: "development", entry: './src/javascripts/index/index.js', output: { filename: "main.[contenthash].js", path: path.resolve(__dirname, "dist") }, plugins: [ new rspack.CssExtractRspackPlugin({ filename: '[name].[contenthash].css', chunkFilename: '[id].[name].[contenthash].css' }), new HTMLWebpackPlugin({ filename: 'index.html', template: './index.html', }), new CleanWebpackPlugin() ], module: { rules: [ { test: /\.css$/, use: [rspack.CssExtractRspackPlugin.loader, "css-loader"], }, { test: /\.scss$/, use: [rspack.CssExtractRspackPlugin.loader, "css-loader", "sass-loader"] }, { test: /\.js(x)?$/, exclude: /node_modules/, use: [ { loader: 'builtin:swc-loader', options: { jsc: { parser: { syntax: "ecmascript", jsx: true, }, transform: { react: { pragma: 'React.createElement', pragmaFrag: 'React.Fragment', throwIfNamespace: true, development: false, useBuiltins: false } }, }, } }, ], } ] }, optimization: { splitChunks: { chunks: 'all', name: false, maxInitialRequests: 25, maxAsyncRequests: 25, }, }, };
And here you can see me referencing plyr.css along with css-component.css.
css-component.css
Here are the bundled files
And here you can see the bundled main.css, which does not include CSS code from plyr.css
main.css
This issue does not occur when I use babel-loader.
babel-loader
Node - v18.12.0; yarn - 1.22.19; @rspack/core - 1.0.11; @rspack/cli - 1.0.8;
Here is a reproduction demo: https://github.com/saidarshan27/swc-plyr-css
I am using a package called
plyr-react
for video player support in an application.plyr-react
exports aplyr.css
file, which is not being included in my final bundle even after being referenced in the entry file.Here is my rspack config
And here you can see me referencing
plyr.css
along withcss-component.css
.Here are the bundled files
And here you can see the bundled
main.css
, which does not include CSS code fromplyr.css
This issue does not occur when I use
babel-loader
.