无法解决这个 web-pack 路径错误

Question

我的项目结构如下：

我有以下 webpack 配置文件：

module.exports = {
    context: __dirname + "/resources",
    entry: "./js/entry.js",
    output: {
        path: __dirname + "/public",
        filename: "bundle.js"
    },
    module: {
        loaders: [
            {
                test: /\.scss$/,
                loaders: ["style", "css", "sass"]
            }
        ]
    }
};

并用

打开我的 entry.js 文件

require('./style.scss');

我知道这种特定的安排可能行不通，但我已经尝试了一个多小时的不同排列、设置和配置，但似乎无法让 webpack 找到我的 .scss 文件。

有人可以告诉我在我的情况下应该如何设置 webpack 配置文件吗？

干杯。

编辑，

尝试在我的要求中提升两个级别，

require('../../scss/style.scss')

仍然给我，

同样适用于

require('../scss/style.scss');

Answer 1

问题出在require语句

require('./style.scss');

它将参考您的 entry.js 文件在 resources/js 目录中搜索您的样式文件，尝试使用此文件要求您的样式：

require('../scss/style.scss');

尝试使用 path 模块来解析上下文路径：

var path = require('path');
...
context: path.resolve("resources"),
...

如果问题解决了请告诉我。

Answer 2

好吧，我觉得自己像个彻头彻尾的白痴，在多次重命名文件和文件夹并尝试对我的 require 语句进行不同的排列后，我注意到错误似乎不断出现

Can't resolve 'style' in ...

原来我没有将 style-loader 和 css-loader 安装到我的项目中，尽管它们与 sass-loader 捆绑在一起。（实际上在 npm 页面上有注明），运行

npm install css-loader style-loader -D

在我的项目目录中解决了这个问题。

仍然感谢您的建议，希望这对以后的人有所帮助。

无法解决这个 web-pack 路径错误

Cannot get my head around this web-pack path error

module

path

webpack

sass-loader