these are my webpack configuration information
var htmlWebpackPlugin = require("html-webpack-plugin");
const CleanWebpackPlugin = require("clean-webpack-plugin");
const ExtractTextPlugin = require("extract-text-webpack-plugin");
let pathsToClean = [
"dist",
];
module.exports = {
entry: "./src/app.js",
output: {
path: __dirname + "/dist",
filename: "static/js/dozhan.[chunkhash].min.js",
},
plugins: [
new htmlWebpackPlugin({
template: "./src/footer.html",
hash: true,
filename: "footer.html",
minify: {
collapseWhitespace: false
}
}),
new CleanWebpackPlugin(pathsToClean),
new ExtractTextPlugin("docs.min.css"),
],
module: {
rules: [
{
test: /\.css$/,
use: ExtractTextPlugin.extract({
fallback: "style-loader",
use: "css-loader"
})
}
]
},
};
this is the content of the entry file I want to compile (app.js):
import "docs"
import "docs.min.css"
console.log("js");
this is my directory structure
problem arises when I add the extract-text-webpack-plugin plug-in and want to compile the css file separately. What"s going on? :
clean-webpack-plugin: C:\Users\Administrator\Desktop\web\dist has been removed.
(node:3592) DeprecationWarning: Tapable.plugin is deprecated. Use new API on `.hooks` instead
(node:3592) UnhandledPromiseRejectionWarning: Unhandled promise rejection (rejection id: 1): Error: Chunk.entrypoints: Use Chunks.groupsIterable and filter by instanceof Entrypoint instead