Javascript MiniCssExtractPlugin未创建css文件
我正在使用React/Node实现服务器端渲染,CSS模块不再工作 我引入了mini css extract插件来从JS中提取css,该插件并没有在公共文件夹(或任何地方)中创建css文件 /package.jsonJavascript MiniCssExtractPlugin未创建css文件,javascript,node.js,reactjs,webpack,ecmascript-6,Javascript,Node.js,Reactjs,Webpack,Ecmascript 6,我正在使用React/Node实现服务器端渲染,CSS模块不再工作 我引入了mini css extract插件来从JS中提取css,该插件并没有在公共文件夹(或任何地方)中创建css文件 /package.json { .... "main": "webpack.config.js", "scripts": { "server": "babel-node ./src/server/index.js", "client": "webpack --watch --pro
{
....
"main": "webpack.config.js",
"scripts": {
"server": "babel-node ./src/server/index.js",
"client": "webpack --watch --progress",
"start": "yarn server & yarn client"
},
...
"devDependencies": {
"@babel/cli": "^7.4.4",
"@babel/core": "^7.4.0",
"@babel/node": "^7.4.5",
"@babel/plugin-proposal-class-properties": "^7.4.0",
"@babel/plugin-syntax-dynamic-import": "^7.2.0",
"@babel/preset-env": "^7.4.2",
"@babel/preset-react": "^7.0.0",
"@babel/register": "^7.4.4",
"babel-loader": "^8.0.5",
"babel-plugin-css-modules-transform": "^1.6.2",
"css-loader": "^2.1.1",
"mini-css-extract-plugin": "^0.6.0",
"react-frontload": "^1.0.7",
"react-loadable": "^5.5.0",
"webpack": "^4.29.6",
"webpack-cli": "^3.3.0",
"webpack-node-externals": "^1.7.2"
}
}
/webpack.config.js
const path = require('path');
const MiniCssExtractPlugin = require('mini-css-extract-plugin');
module.exports = {
mode: 'production',
entry: './src/client/index.js',
target: 'node',
output: {
path: path.resolve(__dirname, 'public'),
filename: 'build.js',
publicPath: '/',
},
resolve: {extensions: ['.js', '.css']},
watch: false,
plugins: [new MiniCssExtractPlugin({filename: 'styles.css'})],
module: {
rules: [
{
test: /\.css$/,
sideEffects: true,
use: [{loader: MiniCssExtractPlugin.loader}, 'css-loader'],
},
{
test: /\.js?$/,
loader: 'babel-loader',
exclude: /node_modules/,
options: {
cacheDirectory: true
}
}
]
}
}
/B.法律改革委员会
{
"presets": ["@babel/env", "@babel/react"],
"plugins": [
"@babel/plugin-syntax-dynamic-import",
"@babel/plugin-proposal-class-properties",
["css-modules-transform", {
"generateScopedName": "[name]__[local]___[hash:base64:5]"
}]
]
}
我希望看到以下文件被创建/public/styles.css,而现在没有在该文件夹或其他任何地方创建任何文件。谢谢你的帮助 检查我的以下配置
const MiniCssExtractPlugin = require("mini-css-extract-plugin");
module.exports = {
plugins: [
new MiniCssExtractPlugin({
filename: "[name].css",
chunkFilename: "[id].css"
}),
],
module: {
rules: [{
test: /\.scss$/,
use: [
'style-loader',
MiniCssExtractPlugin.loader,
{
loader: "css-loader",
options: {
minimize: true,
sourceMap: true
}
},
{
loader: "sass-loader"
}
]
}
]
}
如果您仍然有问题,请告诉我您是如何解决的?我认为
迷你css提取插件
不适用于目标:'node'
我尝试过,对我无效,在构建文件夹中没有创建css文件,还有其他建议吗?您的js中是否包含css文件?