我试图通过webpack编译我的css,它给了我一个成功的javascript文件,但没有说任何关于我的css文件
这是我Webpack配置
`import path from 'path';
import webpack from 'webpack';
import * as MiniCssExtractPlugin from 'mini-css-extract-plugin';
import loader from 'sass-loader';
const extractSASS = new MiniCssExtractPlugin.default({filename: "app.min.css"});
const jQuery = new webpack.ProvidePlugin({
$: "jquery",
jQuery: "jquery"
});
export default {
mode: "production",
entry: {
main: [
"./src/js/index.js"
],
},
output: {
filename: "app.min.js",
path: path.resolve("./../wwwroot/dist")
},
module: {
rules: [
{
test: /\.js$/,
exclude: /node_modules/,
use: {
loader: "babel-loader"
}
},
{
test: /\.scss$/,
use: [
MiniCssExtractPlugin.loader,
"css-loader",
],
test: /\.scss$/,
use: [
{
loader: "postcss-loader",
options: {
config: {
path: path.resolve(import.meta.url, "postcss.config.js")
}
}
},
{
loader: "sass-loader"
}
]
},
{
test: /\.(png|jpe?g|gif)$/,
use: "file-loader?name=images/[name].[contenthash].[ext]"
}
]
},
plugins: [
extractSASS,
jQuery
]
};`
这是npm run build
的输出
npm run build
> cms3@1.0.0 build
> webpack --mode=production
asset app.min.js 169 KiB [compared for emit] [minimized] (name: main) 1 related asset
runtime modules 500 bytes 2 modules
cacheable modules 504 KiB
./src/js/index.js 88 bytes [built] [code generated]
./node_modules/bootstrap/dist/js/bootstrap.js 134 KiB [built] [code generated]
./node_modules/jquery/dist/jquery.js 283 KiB [built] [code generated]
./node_modules/popper.js/dist/esm/popper.js 86.4 KiB [built] [code generated]
webpack 5.75.0 compiled successfully in 3469 ms
1条答案
按热度按时间gwbalxhn1#
很可能webpack认为你的构建不需要CSS文件。你需要在index.js文件中添加一行导入行来告诉webpack: