我正在将Webpack与 html-webpack-plugin ， html-loader ，文件加载器，样式加载器< / em>， css-loader 等。
我的问题与使用open-iconic的css文件进行此设置有关。如果我尝试按照open-iconic website的建议在HTML模板中写入<link..>标记，则会收到一条错误消息，指出在尝试运行输出时，它不是正确的MIME类型（使用Visual Studio代码的调试器） ）：
<link rel="stylesheet" type="text/css" media="screen" href="./assets/font/css/open-iconic-bootstrap.css">
拒绝应用以下样式 'http://localhost:8080/assets/open-iconic-master/font/css/open-iconic-bootstrap.css' 因为它的MIME类型（'text / html'）不是受支持的样式表MIME 类型，并启用严格的MIME检查。 [http://localhost:8080/]
如果相反，我尝试删除<link..>标记，而是像通常使用webpack捆绑包一样将css导入main.scss，它将无法编译。原因是它尝试查找与css相关的字体文件，而不是与我的主index.js文件相关，而不是与css所在的文件夹相关。
@import "./assets/open-iconic-master/font/css/open-iconic-bootstrap.css";
./src/main.scss中的ERROR （./node_modules/css-loader??ref--5-1!./node_modules/postcss-loader/src??ref--5-2!./node_modules/sass-loader/lib/loader.js ?? ref--5-3！./ src / main.scss）找不到模块：错误：无法解析“ ../fonts/open-iconic.eot” 'C：\ Users ..... \ src'@ ./src/main.scss （./node_modules/css-loader??ref--5-1!./node_modules/postcss-loader/src??ref--5-2!./node_modules/sass-loader/lib/loader.js ?? ref--5-3！./ src / main.scss）7：106-141 7：172-207 @ ./src/main.scss @ ./src/index.js @多 （webpack）-dev-server / client？http://localhost:8080 ./src/index.js
对于如何解决此问题的想法将不胜感激。
编辑
非常奇怪。我最初将css文件作为部分导入到main.scss中。导致上述错误。
当我改为将其导入main.js时，它没有引发错误。
不确定到底发生了什么。应该将所有css文件导入到主JS文件中，而不是将其中每个css都换一个@import的{{1}}文件链导入？