webpack编译出错You may need an appropriate loader to handle this file type.

引用css时var footerCss = require("../../css/footer.css");运行报错You may need an appropriate loader to handle this file type.

webpack.config.js配置如下


var debug = process.env.NODE_ENV !== "production";
var webpack = require('webpack');
var path = require('path');
module.exports = {
context: path.join(__dirname),
devtool: debug ? "inline-sourcemap" : null,
entry: "./src/js/index.js",
module: {
loaders: [
{
test: /\.js?$/,
exclude: /(node_modules)/,
loader: 'babel-loader',
query: {
presets: ['react', 'es2015'],
plugins: ['react-html-attrs'], //添加组件的插件配置
}
},
//下面是添加的 css 的 loader，也即是 css 模块化的配置方法，大家可以拷贝过去直接使用
{
test: /\.css$/,
loader: 'style!css-loader?modules&importLoaders=1&localIdentName=[name]__[local]___[hash:base64:5]'
},
]
},
output: {
path: __dirname,
filename: "./src/bundle.js"
},
plugins: debug ? [] : [
new webpack.optimize.DedupePlugin(),
new webpack.optimize.OccurenceOrderPlugin(),
new webpack.optimize.UglifyJsPlugin({ mangle: false, sourcemap: false }),
],
};

package.json文件已经安装了style-loader，和css-loader 模块。全局-g重新安装一遍后，webpack报错

ERROR in ./src/js/components/footer.js
Module not found: Error: Can't resolve 'style' in '/Users/mac/source/9-01'
BREAKING CHANGE: It's no longer allowed to omit the '-loader' suffix when using loaders.You need to specify 'style-loader' instead of 'style',see https://webpack.js.org/guides/migrating/#automatic-loader-module-name-extension-removed@ ./src/js/components/footer.js 25:16-47@ ./src/js/index.js

大意猜测某部分少了-loader，于是在webpack.config .js文件中style改为style-loader

loader: 'style-loader!css-loader?modules&importLoaders=1&localIdentName=[name]__[local]___[hash:base64:5]'

运行webpack成功

webpack编译出错You may need an appropriate loader to handle this file type.相关推荐

Webpack執行打包:“You may need an appropriate loader to handle this file type“
项目场景: 使用webpack對CSS文件和一JS文件進行打包问题描述: 配置webpack.config.js完成;webpack & webpack-cli安裝完成;css-loader ...
[编译记录]遇到“ld: unsupported tapi file type ‘!tapi-tbd‘ in YAML file...”
比较长时间没使用MAC机器编译,系统更新也蛮快的,Xcode也都12了,然后简单make不能跑了.例如,想编译一份新的cmake,遇到"ld: unsupported tapi file t ...
cmake编译出错：No CMAKE_CXX_COMPILER could be found.
cmake编译出错:No CMAKE_CXX_COMPILER could be found. 错误类似: -- The CXX compiler identification is unknown- ...
由一次奇怪的编译出错想起的
现象最近在工作中遇到了一次奇怪的编译出错.事情是这样的,本来这个asp.net webform应用是可以编译的.但是将另外一个class library的工程加入到这个asp.net webform ...
Xamarin.iOS编译出错
Xamarin.iOS编译出错错误信息:C:/Program Files(x86)/Reference Assemblies/Microsoft/Framework/Xamarin.iOS/v1.0 ...
编译出错libicui18n.so.58: undefined reference to `__cxa_throw_bad_array_new_length@CXXABI_1.3.8‘
编译出错libicui18n.so.58: undefined reference to `__cxa_throw_bad_array_new_length@CXXABI_1.3.8' 环境 Ubun ...
android 模块不编译错误,Android 编译出错版本匹配问题解决办法
Android 编译出错版本匹配问题解决办法解决问题的关键在于版本匹配, compileSdkVersion compileSdkVersion targetSdkVersion 这三个参数的整数值 ...
saki4510t的UVCCamera设置匹配android7.1.1 sdk等信息后编译出错
采用的代码来之于https://github.com/saki4510t/UVCCamera 此工程Sdk等版本信息定义 1.1 minSdkVersion 1.2 targetSdkVersion ...
杀毒软件引起的WinCE编译出错问题
最近发现选择PB6.0的Rebuild Current BSP And Subprojects来编译整个BSP包的时候,基本都会弹出下面的编译出错信息: 图1 刚开始还以为是VS2005出问题了,就关 ...

webpack编译出错You may need an appropriate loader to handle this file type.

webpack编译出错You may need an appropriate loader to handle this file type.相关推荐

最新文章

热门文章