webpack打包項目報錯：You may need an appropriate loader to handle this file type, currently no loaders are configured to process this file.

錯誤截圖：

 

錯誤原因：根據金山詞霸翻譯如下：

”您可能需要適當的加載程序來處理此文件類型，當前沒有配置加載器來處理此文件“ 大致意思是程序在打包過程中會去webpack.config.js文件中查找相關css加載器，因為找到所以就報錯了。

解決方法：

1.下載相關插件 style-loader和css-loader

PS D:\WEB前端\案例\前端工程化：ES6模塊化和webpack打包\webpack_study> npm i style-loader css-loader -D
npm WARN webpack-cli@3.3.12 requires a peer of webpack@4.x.x but none is installed. You must install peer dependencies yourself.
npm WARN webpack_study@1.0.0 No description
npm WARN webpack_study@1.0.0 No repository field.
npm WARN optional SKIPPING OPTIONAL DEPENDENCY: fsevents@1.2.13 (node_modules\fsevents):
npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for fsevents@1.2.13: wanted {"os":"darwin","arch":"any"} (current: {"os":"win32","arch":"x64"})

+ css-loader@5.2.6
+ style-loader@3.0.0
added 18 packages from 51 contributors in 3.847s

2.在webpack.config.js文件中加入module對象，對象中包含了rules數組，該數組內是個對象，專門存放各種加載器，

module: {
        rules: [{
            test: /\.css$/,
            use: ['style-loader', 'css-loader']
        }]
}

test屬性值是個正則表達式，\. 表示匹配.號，$表示以css結尾，use屬性中存放的就是加載器。

配置完保存重新運行npm run dev打包文件

至此問題解決。