CSS - 您可能需要适当的加载程序来处理此类文件
问题描述:
在我App.jsx
文件,我导入css文件像这样:import './App.css';
CSS - 您可能需要适当的加载程序来处理此类文件
我在webpack.config.js
下面的代码。
var webpack = require('webpack');
var path = require('path');
var BUILD_DIR = path.resolve(__dirname, 'src/build');
var APP_DIR = path.resolve(__dirname, 'src/app');
var config = {
entry: APP_DIR + '/App.jsx',
output: {
path: BUILD_DIR,
filename: 'bundle.js'
},
module : {
loaders : [
{
test: /\.scss$/,
include : APP_DIR,
loaders : ["style", "css", "sass"]
},
{
test : /\.jsx?/,
include : APP_DIR,
loader : 'babel'
}
]
}
};
module.exports = config;
由于我有一个用于css的加载器,所有内容似乎都没问题。
但是,我得到:
ERROR in ./src/app/App.css
Module parse failed: /path/to/file/App.css Unexpected token (1:0)
You may need an appropriate loader to handle this file type.
SyntaxError: Unexpected token (1:0)
答
你只有一个SCSS装载机设置,以便一旦其打一个CSS文件,它不知道如何解析。
{ test: /\.css$/, loader: "style-loader!css-loader" }
应该让你和打算。
编辑:
此外,如果你正在使用SCSS为什么不只是改变App.css到App.scss这样你的CSS类型是一致的,并没有包括CSS加载器。我会说这是最好的解决方案。
+0
当您说“更改应用程序.css到App.scss“我假定你的意思是转换为SCSS?不要试图成为一个坚持者,但是当你说“改变”对我来说似乎有点模糊,因为它可能意味着只是重命名文件,在这种情况下它不起作用。如我错了请纠正我。 –
您的测试是针对'scss'而不是'css',做'require('app.scss')',或者如果您想直接导入css,请为'css'添加另一个测试 – Keith