聊聊Angular项目中将 .css 文件修改为 .scss 文件的方法


本文摘自PHP中文网,作者青灯夜游,侵删。

本篇文章和大家聊聊Angular 初始化项目后,怎么把默认的 .css 文件修改为 .scss 文件?介绍一下处理方法。有一定的参考价值,有需要的朋友可以参考一下,希望对你们有所助。

【相关教程推荐:《angular教程》】

问题:下图是初始化后的项目。项目里面的样式文件是 .css 文件,想把 .css 修改为 .scss 应该如何处理呢?

1.gif

解决方法:执行如下命令:

find . -name "*.css" -exec bash -c 'mv "$1" "${1%.css}".scss' - '{}' \;

然后就会看到控制台有报错,因为之前引用 .css 文件的地方,现在变成 .scss 文件了,需要修改一下引用。

2.png

修改的地方有两处:

1 是业务组件

2 是项目的配置文件。

业务组件,就是将原来引用.css 的地方,后缀修改为 .scss。举例:

3.png

项目配置信息,即在 angular.json 中修改如下:

阅读剩余部分

相关阅读 >>

浅谈Angular中组件样式的工作原理

详解Angular中的组件交互

详解Angular中的observable(可观察对象)

聊一聊Angular中的路由(routing)

浅谈Angular中父子组件间怎么传递数据

浅谈Angular指令中的4种设计模式

5种Angular中组件通信的方法介绍

浅谈Angular中的变化检测(change detection)

浅谈Angular中如何添加和使用font awesome

聊聊Angular中的模板输入变量(let-变量)

更多相关阅读请进入《Angular》频道 >>




打赏

取消

感谢您的支持,我会继续努力的!

扫码支持
扫码打赏,您说多少就多少

打开支付宝扫一扫,即可进行扫码打赏哦

分享从这里开始,精彩与您同在

评论

管理员已关闭评论功能...

    正在狠努力加载,请稍候...