我正在尝试在我的 React JS 元素中插入我的样式和 Bootstrap 。但我收到错误消息:拒绝应用来自“http://localhost:8000/bootstrap-3.3.7-dist/css/bootstrap.min.css”的样式' 因为它的 MIME 类型('text/html')不是受支持的样式表 MIME 类型，并且启用了严格的 MIME 检查。
我希望它通过 index.html 插入，因为这是我习惯的方式。我知道通过 npm 插入 Bootstrap 并导入它的方法，但我仍然只想通过 index.html 插入它。
文件的层次结构
目前我的代码如下:
索引.HTML
<!DOCTYPE html>
<html lang="en">
<head>
<title>Ticketing</title>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<!-- Tell the browser to be responsive to screen width -->
<meta content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" name="viewport">
<link rel="stylesheet" type="text/css" href="./bootstrap-3.3.7-dist/css/bootstrap.min.css"/>
<link rel="stylesheet" type="text/css" href="./style/style.css" />
</head>
<body>
<div id="app"></div>
<script src="/app/bundle.js"></script>
</body>
</html>
WEBPACK.CONFIG.JS
var webpack = require("webpack");
var path = require("path");
var DIST_DIR = path.resolve(__dirname, "dist");
var SRC_DIR = path.resolve(__dirname, "src");
var config = {
entry: SRC_DIR + "/app/index.js",
output: {
path: DIST_DIR + "/app",
filename: "bundle.js",
publicPath: "/app/"
},
module:{
loaders: [
{
test: /\.js?/,
include: SRC_DIR,
loader: "babel-loader",
query:{
presets: ["react", "es2015", "stage-2"]
}
}
]
}
};
module.exports = config;
最佳答案
我认为您应该将css 和style 文件夹移动到src 文件夹中。或者尝试将 ./ 更改为 ../.
关于javascript - 无法在 ReactJS 中为 Bootstrap 和 Stylesheet 添加 css 文件，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/48823559/