详解Angular-cli生成组件修改css成less或sass的实例


Posted in Javascript onJuly 27, 2017

详解Angular-cli生成组件修改css成less或sass的实例

使用cli命令生成组件:

ng generate component 组件名

生成出来的组件文件有:html / ts / css / spec.ts

问题我是一个less重度患者怎么可能再去写css呢。

于是我就在想使用cli生成组件的时候能直接生成出来的是less文件而不是css文件;

修改angular-cli.json文件:

apps 
  "styles": [
    "styles.less"
  ]
"defaults": 
  "styleExt": "less",

这样就能用组件命令生成的时候替换css文件成less文件

但是angular代码会报错,需要去修改所有的.css文件成.less文件。

ts文件内引用的styleUrls里面的css修改成less

cli编辑不报错了

less编译问题:

less less-loader

sass文件的操作如上一样

 以上就是对Angular-cli生成组件修改css成less或sass的实例详解,如有疑问请留言或者到本站社区交流讨论,本站关于AngularJS 的文章还有很多,欢迎大家搜索查阅,感谢阅读,希望能帮助到大家,谢谢大家对本站的支持!

Javascript 相关文章推荐
两个比较有用的Javascript工具函数代码
Feb 17 Javascript
jQuery图片的展开和收缩实现代码
Apr 16 Javascript
快速查找数组中的某个元素并返回下标示例
Sep 03 Javascript
jQuery四种选择器使用及示例
Jun 05 Javascript
JavaScript 数组中最大最小值
Jun 05 Javascript
getElementById().innerHTML与getElementById().value的区别
Oct 27 Javascript
微信小程序 Toast自定义实例详解
Jan 20 Javascript
Grunt针对静态文件的压缩,版本控制打包的实例讲解
Sep 29 Javascript
JS实现websocket长轮询实时消息提示的效果
Oct 10 Javascript
koa-router源码学习小结
Sep 07 Javascript
vue组件间通信六种方式(总结篇)
May 15 Javascript
js HTML DOM EventListener功能与用法实例分析
Apr 27 Javascript
Vue中如何实现轮播图的示例代码
Jul 27 #Javascript
基于构造函数的五种继承方法小结
Jul 27 #Javascript
vue中各组件之间传递数据的方法示例
Jul 27 #Javascript
微信小程序 页面跳转传值实现代码
Jul 27 #Javascript
JS实现按钮控制计时开始和停止功能
Jul 27 #Javascript
关于JavaScript中forEach和each用法浅析
Jul 27 #Javascript
Easyui使用Dialog行内按钮布局的实例
Jul 27 #Javascript
You might like
一棵php的类树(支持无限分类)
2006/10/09 PHP
php 中文字符入库或显示乱码问题的解决方法
2010/04/12 PHP
php 中文字符串首字母的获取函数分享
2013/11/04 PHP
分享下页面关键字抓取components.arrow.com站点代码
2014/01/30 PHP
php文件上传后端处理小技巧
2016/05/22 PHP
用javascript控制iframe滚动的代码
2007/04/10 Javascript
jQuery筛选器children()案例详解(图文)
2013/02/17 Javascript
javascript写的异步加载js文件函数(支持数组传参)
2014/06/07 Javascript
js调试系列 控制台命令行API使用方法
2014/06/18 Javascript
超级给力的JavaScript的React框架入门教程
2015/07/02 Javascript
javascript表单验证大全
2015/08/12 Javascript
Zero Clipboard实现浏览器复制到剪贴板的方法(多个复制按钮)
2016/03/24 Javascript
20分钟打造属于你的Bootstrap站点
2016/07/27 Javascript
JS模拟实现方法重载示例
2016/08/03 Javascript
Bootstrap学习笔记 轮播(Carousel)插件
2017/03/21 Javascript
jQuery简单实现向列表动态添加新元素的方法示例
2017/12/25 jQuery
详解微信UnionID作用
2019/05/15 Javascript
解决layui 三级联动下拉框更新时回显的问题
2019/09/03 Javascript
vue 通过绑定事件获取当前行的id操作
2020/07/27 Javascript
vue移动端写的拖拽功能示例代码
2020/09/09 Javascript
[01:49]一目了然!DOTA2DotA快捷操作对比第二弹
2014/05/16 DOTA
浅析使用Python操作文件
2017/07/31 Python
Python方法的延迟加载的示例代码
2017/12/18 Python
Python 使用PIL中的resize进行缩放的实例讲解
2018/08/03 Python
详谈Python 窗体(tkinter)表格数据(Treeview)
2018/10/11 Python
python 2.7 检测一个网页是否能正常访问的方法
2018/12/26 Python
Python 中包/模块的 `import` 操作代码
2019/04/22 Python
在Python函数中输入任意数量参数的实例
2019/07/16 Python
Python decimal模块使用方法详解
2020/06/08 Python
关于PySnooper 永远不要使用print进行调试的问题
2021/03/04 Python
canvas像素画板的实现代码
2018/11/21 HTML / CSS
Ivory Isle Designs美国/加拿大:婚礼和活动文具公司
2018/08/21 全球购物
人事行政专员岗位职责
2014/07/23 职场文书
2015年档案管理工作总结
2015/04/08 职场文书
JS中一些高效的魔法运算符总结
2021/05/06 Javascript
浅谈Python中的函数(def)及参数传递操作
2021/05/25 Python