使用angular cli 6项目在chrome中的工作区中使用组件css文件

发布时间：2020-12-17 18:11:27 所属栏目：安全来源：网络整理

导读：我正在尝试在Angular 6/7 CLI项目中使用Google Chrome工作区和CSS持久编辑. 在angular.json配置中添加“extractCSS：true”并使用“–source-map = true”标志时,我可以在Chrome中的“sources”和“elements”标签中看到CSS文件,我可以将其映射到在线CSS文件

我正在尝试在Angular 6/7 CLI项目中使用Google Chrome工作区和CSS持久编辑.

在angular.json配置中添加“extractCSS：true”并使用“–source-map = true”标志时,我可以在Chrome中的“sources”和“elements”标签中看到CSS文件,我可以将其映射到在线CSS文件,但在“元素”面板中更改样式时,更改不会持久,也不会保存到文件中.

是否可以使用工作区从Chrome开发工具中编辑组件CSS文件(不弹出应用程序)？

>在下面的GIF中你可以看到,虽然文件名附近的小绿点是打开的,表示网络之间的地图
资源和本地文件已经建立,变化来自
元素面板未反映在文件中：

changes are not saved to file

解决方法

Chrome DevTools的技术作家@Kayce Basques评论了与此类似的 question,他说：

DevTools technical writer here. The workflow that benshabatnoam posted is the best we’ve got. Set up a Workspace and then edit your files from the Sources panel. Editing from Elements panel > Styles pane works on basic projects,but has trouble with frameworks (such as Angular) that use sourcemaps and do a lot of build transformations. Sucks,I know,but I recall that we’ve looked into it in-depth and our hands are tied until sourcemap usage is standardized.

不幸的是,你的问题的答案是否定的,我们不能(至于今天)从Chrome开发工具中编辑组件CSS文件与工作区:(

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!