在开发工具上使用Ionic时无法查看scss文件

Question

我正在尝试从Ionic网站（Ionic Tutorial）获得一些非常基本的离子教程，我希望能够从开发工具中查看和修改scss。

应用程序正常运行，我在scss文件中添加的css类也正常工作，但我看到一个main.css文件而不是编译它的foo.css。我甚至可以在开发工具和调试上查看打字稿文件，这意味着 js-＆gt; ts的源地图正在运行。这是 css-＆gt; scss那是行不通的。

我可以在www / build

上看到这些文件

• main.js
• main.map.js
• 的main.css
• main.map.css

这意味着正确生成了源映射。 我还在chrome中启用了css源地图   - DevTools - ＆gt;设置 - ＆gt;来源 - ＆gt;启用CSS源地图

Answer 1

我会将其标记为重复，但似乎我不能。答案可以在这篇SO enter link description here上找到。基本上，

您需要扩展sass.config.js文件，默认情况下，sass的源映射已禁用。

配置/ sass.config.js：

module.exports = {
  sourceMap: true,
}

的package.json：

"config": {
  "ionic_sass": "./config/sass.config.js",
}

我可以验证这是否有效。