Warning: file_get_contents(/data/phpspider/zhask/data//catemap/9/javascript/466.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Javascript 如何在JS项目中解决这个css类问题?_Javascript_Html_Css - Fatal编程技术网

Javascript 如何在JS项目中解决这个css类问题?

Javascript 如何在JS项目中解决这个css类问题?,javascript,html,css,Javascript,Html,Css,我正在尝试使用Javascript构建一个单页html应用程序。我将css文件与index.js文件放在同一个文件夹“src”中。我的webpack.config.js文件如下: var path=require('path'); var webpack=require('webpack'); var vtkRules=require('vtk.js/Utilities/config/dependency.js')。webpack.core.rules; //如果要加载*.css和*.modu

我正在尝试使用Javascript构建一个单页html应用程序。我将css文件与index.js文件放在同一个文件夹“src”中。我的webpack.config.js文件如下:

var path=require('path');
var webpack=require('webpack');
var vtkRules=require('vtk.js/Utilities/config/dependency.js')。webpack.core.rules;
//如果要加载*.css和*.module.css文件,则为可选
//var cssRules=require('vtk.js/Utilities/config/dependency.js')。webpack.css.rules;
var entry=path.join(uu dirname,'./src/index.js');
const sourcePath=path.join(_dirname,'./src');
const outputPath=path.join(uu dirname,'./dist');
module.exports={
进入
输出:{
路径:outputPath,
文件名:“MyWebApp.js”,
},
模块:{
规则:[{
测试:[/\.js$/,/\.jsx$/,/\.es6$/],
包括:[
解析(uu dirname,'src'),
],
使用:{
加载器:“巴别塔加载器”
},
}, {
测试:[/\.css/],
排除:path.resolve(uu dirname,'src'),
使用:[
“样式加载器”,
{
加载器:“css加载器”,
选项:{
模块:对,
localIdentName:“[name]\u u[local]-[hash:base64:5]”
}
}
]
}, {
测试:[/\.css/],
包括:path.resolve(uu dirname,'src'),
使用:[
“样式加载器”,
“css加载器”
]
}]
},
决心:{
模块:[
解析(uuu dirname,'node_modules'),
源路径,
],
},

};错误告诉您问题的确切位置。当选择器为单个
:local
类名时,不允许编写。如果该组件是您的,则需要更新样式


如果该组件不是您的组件,并且是node_模块的一部分(看起来是),您可能需要更改在项目中导入的方式

我能够解决我自己的问题。以下是有效的修订网页文件:

var path=require('path');
var webpack=require('webpack');
var vtkRules=require('vtk.js/Utilities/config/dependency.js')。webpack.core.rules;
//如果要加载*.css和*.module.css文件,则为可选
//var cssRules=require('vtk.js/Utilities/config/dependency.js')。webpack.css.rules;
var entry=path.join(uu dirname,'./src/index.js');
const sourcePath=path.join(_dirname,'./src');
const outputPath=path.join(uu dirname,'./dist');
module.exports={
进入
输出:{
路径:outputPath,
文件名:“MyWebApp.js”,
},
模块:{
规则:[
{test:/\.html$/,loader:'html loader'},
{
测试:[/\.js$/,/\.jsx$/,/\.es6$/],
包括:[
解析(uu dirname,'src'),
],
使用:{
加载器:“巴别塔加载器”,
},
}, 
{
测试:/\(gif | svg | jpg | png)$/,
加载器:“文件加载器”,
},
{
测试:[/\.css/],
包括:[
join(uu dirname,'src'),
join(uuu dirname,'node_modules'),
join(uuu dirname,'node_modules/react toolbox'),
],
使用:[
“样式加载器”,
{
加载器:“css加载器”,
选项:{
模块:对,
}
}
]
}, 
].concat(vtkRules),
},
决心:{
模块:[
解析(uuu dirname,'node_modules'),
源路径,
],
},

};安装加载程序
npm安装--保存开发风格加载器
或/和
npm安装风格加载器css加载器
能否发布
/src/GeometryViewer.module.css
?我已经尝试过installe加载器,npm安装--保存开发风格加载器和npm安装风格加载器css加载器。还不走运,谢谢。在充分披露我不是一个JS程序员太多。这个部件不是我的。如何导入和“更新样式”?很抱歉,我直到现在才在上面的答案中看到您的问题。您应该知道,您配置的这个加载程序会将所有.css文件视为css模块。如果您有任何依赖项中的任何普通CSS(因为我看到您包括node_modules文件夹),您可能会遇到问题。我建议您为启用模块的
.module.css
配置单独的规则,并从禁用模块的其他加载程序中排除
.module.css