未找到模块：错误：无法解析目录中的“./style.css”？

我试图运行命令npm run build，但它不工作。而我得到的错误如下：未找到模块：错误：无法解析目录中的“./style.css”？

> [email protected] build /Users/Prashant/Code/typescript 
> webpack 

Hash: c6dbd1eb3357da70ca81 
Version: webpack 3.2.0 
Time: 477ms 
    Asset  Size Chunks    Chunk Names 
bundle.js 2.89 kB  0 [emitted] main 
    [0] ./src/index.js 51 bytes {0} [built] 
    [1] ./src/index.css 290 bytes {0} [built] [failed] [1 error] 

ERROR in ./src/index.css 
Module build failed: Unknown word (5:1) 

    3 | // load the styles 
    4 | var content = require("!!./index.css"); 
> 5 | if(typeof content === 'string') content = [[module.id, content, '']]; 
    |^
    6 | // Prepare cssTransformation 
    7 | var transform; 
    8 | 


@ ./src/index.js 1:0-22

我的网络包的配置文件（webpack.config.js）是：

var path = require('path'); 

module.exports = { 
    entry: './src/index.js', 
    output: { 
     path: path.resolve(__dirname, 'dist'), 
     filename: 'bundle.js' 
    }, 
    module: { 
     rules: [ 
      { 
       test: /\.css$/, 
       use: [ 
        'css-loader', 
        'style-loader' 
       ] 
      } 
     ] 
    } 
};

我的CSS文件（index.css）是

body { 
    color:red; 
}

和我的js文件index.js低于：

require("./index.css"); 
alert('this is my alert');

我试图运行该文件，但它不工作我检查了所有的拼写，也尝试添加很多其他的CSS，但它不工作，你能帮我，我该如何解决这个问题？

来源

2017-07-22 Prashant Barve

装载机以相反的顺序应用。这意味着您首先应用style-loader，然后将其结果传递给css-loader。 style-loader的输出是JavaScript，它会将样式插入到<style>标记中，但css-loader需要CSS并且无法解析JavaScript，因为它不是有效的CSS。

正确的规则是：

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

来源

2017-07-22 13:40:39

未找到模块：错误：无法解析目录中的“./style.css”？

回答

相关问题