问题标签 [sass-loader]
For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.
angularjs - sass-loader 的无效 CSS 错误
我的应用程序.scss
我执行时的输出错误./node_modules/.bin/webpack
我的webpack.config
和我的app.js
javascript - 带有源映射和 url 语句的 Webpack sass 加载器
我已经读过，为了获得源地图，我必须在url('')声明中使用绝对网址。我是这样做的：
当我从 css 加载器中删除 sourceMap 选项时它可以工作，如果我激活它则不会。
我想我可能在绝对路径点的某个地方失败了，你有什么想法吗？
这是我的配置文件：
在更一般的想法上，我找不到我正在尝试做的工作示例。如果您可以将我重定向到那个，我会非常感兴趣。
javascript - Webpack - sass 加载器找不到图像
医生sass loader说："If you're just generating CSS without passing it to the css-loader, it must be relative to your web root"。所以我照它说的做了，我有我index.html的project root，然后我试图image从我的scss文件中加载一个。现在我有 2 个错误：1）来自Chrome's console: Cannot find module "./img/header.jpg"。2）从我的terminal：
webpack.config.js
如果我看到我的代码，我可以清楚地看到我的 css 存在于内部<head>，因此我已将图像的路径指向我的根目录，如文档所述，但仍然无法修复它。
更新：
我已经安装file-loader并按照说明进行操作，现在我在控制台中收到此错误：GET http://localhost:3000/public/img/header.jpg 404 (Not Found) - jquery.js:9119
javascript - ReactJs 节点 - 未找到 Webpack sass-loader jpg 404
我真的要疯了。我正在开发一个React/Node+Express应用程序，但我从未想过像从中加载图像这样简单的操作sass会如此复杂。
在我的根目录中，我有main.jsx,index.html和 2 个文件夹：“ public”（包括css/js/img）和“ components”，其中包含header.jsx和其他。现在，我想在我的header.jsx组件中加载背景图片
头文件.jsx
为此，我将 mywebpack 配置为加载 sass：
webpack.config.js
那么，我的header.scss
头文件.scss
要从我的节点服务器加载静态文件，我已经配置了我的文件夹：
服务器.js
在我的console我得到这个错误：http://localhost:3000/public/img/header-bg.jpg 404 (Not Found)。我真的无法理解这个如此基本的配置有什么问题。
performance - 使用 Webpack 热模块替换优化 Sass 编译
使用 Webpack 热模块替换时，哪些因素会影响 Sass 文件的编译性能？
我目前有很多 Sass 文件，组织到多个目录中：
每个目录都有一个加载文件的清单，加载所有清单以及所有供应商库的入口点是main.scss.
目前，我需要从我的应用程序入口点 ( app.js) 获取此文件：
虽然 HMR 目前可以工作，但在保存更改的文件和在浏览器中更新更改之间存在很长的延迟。
我的 Sass 加载器：
开发工具配置：
哪些因素会影响 HMR 更新的速度？
sass - Webpack SASS-loader include 语句中断 SASS @import statemetns
所以对于背景，最初我在我的 Webpack 配置中排除了 node_modules 目录，这对于我的 sass @import 语句来说工作得很好，但是很难从 node_modules 目录中包含东西。所以我将SASS加载器切换到以下
另请注意，我尝试在客户端使用和不使用斜杠。我所有的 src 文件（包括 sass 文件）都在 ./src/client 目录中，包括子目录。现在的问题是，当我运行 Webpack 时，我的所有导入语句都不再起作用。每当我尝试导入自己的 sass 文件之一时，都会出现以下错误：
如果我注释掉包含语句一切都很好，但我知道这不是一个好方法。作为参考，我还从我的配置中包含了我的解析语句：
sass - webpack (with sass-loader) - scss 文件 @import 无法识别解析别名
我的项目结构：
在 webpack.config module.exports 中：
在我的文件中 - myComponent.scss：
构建 bundle.js 时出现此错误：
如何在 sass 文件中 @import 别名？
javascript - Vue.js + Webpack + vue-loader + bootstrap-sass + sass-loader
我刚刚开始使用 Vue.js + Webpack + vue-loader + bootstrap-sass + sass-loader，我有点迷茫。
我想做的是将 SASS 版本的引导程序与我的 SPA Vue.js 代码一起使用。我想这样做，这样我的引导程序定制就可以使用 SASS 来完成。这是我所做的：
- 使用 vue-cli 创建了一个新的 Vue.js + webpack 项目。
- 安装了 bootstrap-sass 和 sass-loader。
在 build/webpack.base.conf.js 中添加了以下内容：
/li>用一行创建了 src/style.scss：
@import 'bootstrap';- 将此行添加到 src/main.js 的顶部：
import './style.scss'
当我现在运行时npm run dev，出现以下错误：
我不确定为什么这不起作用。
另外，与这个问题相关，我如何访问我的 Vue 组件中的 Bootstrap SASS 变量？如果我了解这里发生了什么，SASS 将在被内联包含在 main.js 之前被编译为 CSS，这意味着无法访问我的组件中的任何 Bootstrap 变量。有没有办法做到这一点？
webpack - 带有 sourcemap 和 devtool 的 Webpack sass-loader
嘿，我是 Webpack 的新手。
我通过源映射的 cmd 参数搜索在开发和生产模式之间切换的解决方案。
Webpack 自带
但是这个命令被 sass-loader 忽略（https://github.com/jtangelder/sass-loader）
根据 sass-loader 页面上的描述，在配置文件中编写 sourcemaps 修复的选项是非常必要的：
是否有任何解决方案可以通过命令行进行配置？
sass - 是否可以使用 Webpack 和 sass 加载程序将 NODE_ENV 参数注入 sass 文件？
我正在尝试将 NODE_ENV 注入到 sass 文件中，因此我可以为 dev/prod env 提供不同的输出，并有一个 sass 函数，其中包含类似的条件：
@if (NODE_ENV == 'prod') {}
我的 webpack.config 看起来像这样：
我尝试将数据参数传递给加载程序，但我尝试过的没有任何效果。将不胜感激任何帮助！