const path = require('path');
var webpack = require('webpack'),
ExtractTextPlugin = require("extract-text-webpack-plugin");
var nodeExternals = require('webpack-node-externals');
const CssEntryPlugin = require("css-entry-webpack-plugin");
module.exports = {
entry: {
index: './js/index.js',
product_details: './js/index.js',
signup: ['./js/signup.js','./js/index.js'],
signup_style: ['./css/signup.css']
},
output: {
path: path.resolve(__dirname, 'dist/js'),
filename: "[name].min.js"
},
externals: [nodeExternals()],
module: {
rules: [
{
test: /\.js/,
use: 'babel-loader',
exclude: /node_modules/,
},
{
test: /\.css$/,
use: ExtractTextPlugin.extract({
fallback: 'style-loader',
use: [{
loader: 'css-loader',
options: {
minimize: true,
}
}]
})
}
]
},
plugins: [
new ExtractTextPlugin('../css/[name].css')
]
};
Above is my webpack.config.js file. It creates signup_style.min.js and signup_style.css files. I want only signup_style.css file to create and not signup_style.min.js.
How can we do that?
To be able to use CSS in your webpack app, you need to set up a new loader. Out-of-the-box, webpack only understands Javascript and JSON. With a loader, you can translate another type of file to a format that webpack understands and can work with. There are many webpack loaders and each loader has a specific purpose.
You can bundle your JavaScript using the CLI command by providing an entry file and output path. Webpack will automatically resolve all dependencies from import and require and bundle them into a single output together with your app's script.
CSS Loader being a front-end component is defined as an npm Module that collects all the CSS files referenced in the working application to help webpack and consolidate into a string. This compiles an application of a particular resource as a JavaScript module (CSS to JS file).
You can use https://www.npmjs.com/package/webpack-fix-style-only-entries
This is a small plugin developed to solve the problem of having a style only entry (css/sass/less) generating an extra js file.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With