使用 Chrome DevTools 编辑 SCSS 在 Ionic 项目中不起作用
Editing SCSS using Chrome DevTools not working in Ionic project
对于 Web 项目，我总是使用 Chrome DevTools 在本地修改页面的 CSS 而无需重新加载。这似乎在我的 ionic4 项目中不起作用，仅使用 ionic serve 为页面提供服务。我可以在 devtools 的 Sources -> Page 部分看到我想编辑的源文件，但是当我在这里进行修改时，我在实时页面中看不到更改。
见下图：
在开发工具中，我想更改#play-pause，比如添加更大的边距，例如 margin-top: 20px。如果我在 Chrome DevTools 中编辑它，我看不到任何变化。但是，如果我转到 IDE，在那里进行相同的 CSS 更改并保存，那么 ionic dev 服务器将自动重启并且 CSS 更改将生效。
如果有人有任何线索或可以尝试的事情，请告诉我，谢谢！
看看这个 post：Sass Source Maps + Chrome = Magic
另见：
- How to make CSS sourcemapping work in Chrome with Compass (SASS)
对于 Web 项目，我总是使用 Chrome DevTools 在本地修改页面的 CSS 而无需重新加载。这似乎在我的 ionic4 项目中不起作用，仅使用 ionic serve 为页面提供服务。我可以在 devtools 的 Sources -> Page 部分看到我想编辑的源文件，但是当我在这里进行修改时，我在实时页面中看不到更改。
见下图：
在开发工具中，我想更改#play-pause，比如添加更大的边距，例如 margin-top: 20px。如果我在 Chrome DevTools 中编辑它，我看不到任何变化。但是，如果我转到 IDE，在那里进行相同的 CSS 更改并保存，那么 ionic dev 服务器将自动重启并且 CSS 更改将生效。
如果有人有任何线索或可以尝试的事情，请告诉我，谢谢！
看看这个 post：Sass Source Maps + Chrome = Magic
另见：
- How to make CSS sourcemapping work in Chrome with Compass (SASS)