Sass 提取文本网页包插件不创建样式表

我正在使用webpack和sass loader在我的公共目录中生成一个

custom.css

文件。我的webpack.config文件包含以下内容：

//webpack.config.js

var ExtractTextPlugin = require("extract-text-webpack-plugin");

css在.views/index.html文件中调用：

my package.json中的开发脚本包括：

    "webpack-dev-server": "NODE_ENV=development PORT=8080 webpack-dev-server --content-base public/ --hot --inline --devtool inline-source-map --history-api-fallback",
    "development": "cp views/index.html public/index.html && NODE_ENV=development webpack && npm run webpack-dev-server"

在

/components/App.js

中，我有：

//样式表
从“custom.scss”导入SCS

但我得到了以下错误：

RROR in ./components/App.js
Module not found: Error: Cannot resolve module 'custom.scss' in /Users/koko1/apps/bamba-2017/components
 @ ./components/App.js 38:18-40

---

我假设没有创建任何内容，因为它不会将

html

文件中的

link

转换为单独的

css

。它将条目块中的每个

require（'any-file-name.scss'）

（在您的配置中）移动到一个单独的scss文件中

我假设没有创建任何内容，因为没有将

html

文件中的

link

转换为单独的

css

。它将条目块中的每个

require（'any-file-name.scss'）

（在您的配置中）移动到一个单独的scss文件中

好的，我已经开始工作了，下面是发生的情况：

我的

提取文本网页包插件

版本不符合其网页包版本依赖关系（

未满足对等依赖关系webpack@1.12.6

）

我升级到

“webpack”：“^2.2.1”

，并不断收到一些模糊的错误，尤其是这个错误：

/节点_modules/loader runner/lib/loader.js:35抛出新错误（“Module'+loader.path+“'不是加载器（必须具有正常或变桨功能）”）；

这意味着，无论何时在webpack.config.js中使用webpack 2中的加载程序，都需要指定它是一个加载程序。比如：

加载程序：['style'，'css']

将抛出一个错误，需要更正为：

加载程序：['style-loader'，'css-loader']

另一件事是，当您创建

ExtractTextPlugin

plugin实例时，请指定输出文件的文件名，以便：

newextractTextPlugin（{filename:'css/[name].css'，disable:false，allChunks:true}）

在我完成上述所有操作并添加了

//样式表之后
要求（'../src/sass/test.scss'）

对于my App.js文件，css现在在正确的public/css/test.css文件中创建

---

如果有人能想出一个更好的要求，请告诉我。

好的，我成功了，下面是发生的情况：

我的

提取文本网页包插件

版本不符合其网页包版本依赖关系（

未满足对等依赖关系webpack@1.12.6

）

我升级到

“webpack”：“^2.2.1”

，并不断收到一些模糊的错误，尤其是这个错误：

/节点_modules/loader runner/lib/loader.js:35抛出新错误（“Module'+loader.path+“'不是加载器（必须具有正常或变桨功能）”）；

这意味着，无论何时在webpack.config.js中使用webpack 2中的加载程序，都需要指定它是一个加载程序。比如：

加载程序：['style'，'css']

将抛出一个错误，需要更正为：

加载程序：['style-loader'，'css-loader']

另一件事是，当您创建

ExtractTextPlugin

plugin实例时，请指定输出文件的文件名，以便：

newextractTextPlugin（{filename:'css/[name].css'，disable:false，allChunks:true}）

在我完成上述所有操作并添加了

//样式表之后
要求（'../src/sass/test.scss'）

对于my App.js文件，css现在在正确的public/css/test.css文件中创建

---

如果有人能想出更好的要求，请告诉我。

您有任何错误吗？您是否通过

require（）

或

import

将您的

SCS

包含在项目中？您好，没有错误，不会创建custom.css文件。即使按照上述从index.html引用了SCS，您仍然需要它吗？您有任何错误吗？您是否通过

require（）

或

import

将您的

SCS

包含在项目中？您好，没有错误，不会创建custom.css文件。如果我理解正确，我必须使custom.scss成为一个依赖项，而不是依赖extract text webpack插件将其作为.css文件输出到我的公用文件夹中。这是非常误导的，插件的目的是什么？我已经用scr/scss文件夹的路径更新了上面的代码（

includePaths:[path.resolve（\uu dirname，“./src/sass”）]

），并在我的root>components>App.js文件中要求它，但现在我得到了一个模块未解决的错误。提取文本网页包插件的目的是捆绑多个（或一个）不

.js

将文件转换为一个外部文件。您必须使用

require（）

或

import

，因为如果未导入，webpack将永远看不到它（webpack使用入口点作为开始点，然后从该点查找所有包含的模块）。您可以使用自动将提取的文件导入html文件。谢谢，正确的语法是什么？我尝试了require和import，但无法解决./src/scss/custom.scss文件的路径问题。很难说。。。语法是正确的，只是不知怎么找不到。

custom.scss

是否位于

/components/

目录中？它位于

/src/scss

中。我必须将webpack升级到2，以便它能够与extract text webpack插件正常工作，并且由于我一直遇到此错误：

抛出新错误（“模块”'+loader.path+“'不是加载程序（必须具有正常或基音功能）”如果我理解正确，我必须使custom.scss成为一个依赖项，而不是依赖extract text webpack插件将其输出为公用文件夹中的.css文件。这是非常误导的，插件的目的是什么？我已经用th更新了上面的代码
RROR in ./components/App.js
Module not found: Error: Cannot resolve module 'custom.scss' in /Users/koko1/apps/bamba-2017/components
 @ ./components/App.js 38:18-40