详解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 相关文章推荐
加载jQuery后$冲突的解决办法
Jul 09 Javascript
jquery 全局AJAX事件使用代码
Nov 05 Javascript
使用jquery与图片美化checkbox和radio控件的代码(打包下载)
Nov 11 Javascript
xml文档转换工具,附图表例子(hta)
Nov 17 Javascript
一个级联菜单代码学习及removeClass与addClass的应用
Jan 24 Javascript
将鼠标焦点定位到文本框最后(代码分享)
Jan 11 Javascript
JS简单实现获取元素的封装操作示例
Apr 07 Javascript
浅谈Vue内置component组件的应用场景
Mar 27 Javascript
解析vue路由异步组件和懒加载案例
Jun 08 Javascript
jQuery轮播图实例详解
Aug 15 jQuery
vue中slot(插槽)的介绍与使用
Nov 12 Javascript
vscode 插件开发 + vue的操作方法
Jun 05 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数组冒泡排序算法实例
2016/05/06 PHP
ThinkPHP使用getlist方法实现数据搜索功能示例
2017/05/08 PHP
PHP流Streams、包装器wrapper概念与用法实例详解
2017/11/17 PHP
使用PHP开发留言板功能
2019/11/19 PHP
Javascript技巧之不要用for in语句对数组进行遍历
2010/10/20 Javascript
jquery 圆形旋转图片滚动切换效果
2011/01/19 Javascript
弹出层之1:JQuery.Boxy (一) 使用介绍
2011/10/06 Javascript
javascript中的括号()用法小结
2014/04/14 Javascript
EasyUI的doCellTip实现鼠标放到单元格上提示单元格内容
2016/08/24 Javascript
Bootstrap table学习笔记(2) 前后端分页模糊查询
2017/05/18 Javascript
js实现移动端导航点击自动滑动效果
2017/07/18 Javascript
layui之select的option叠加问题的解决方法
2018/03/08 Javascript
vue 不使用select实现下拉框功能(推荐)
2018/05/17 Javascript
Vue实现调节窗口大小时触发事件动态调节更新组件尺寸的方法
2018/09/15 Javascript
微信小程序学习笔记之表单提交与PHP后台数据交互处理图文详解
2019/03/28 Javascript
layui 关闭open弹出框 刷新table表格页面的方法
2019/09/16 Javascript
使用typescript快速开发一个cli的实现示例
2020/12/09 Javascript
python使用append合并两个数组的方法
2015/04/28 Python
Python 正则表达式 re.match/re.search/re.sub的使用解析
2019/07/22 Python
使用Django搭建一个基金模拟交易系统教程
2019/11/18 Python
Tensorflow限制CPU个数实例
2020/02/06 Python
解决pycharm同一目录下无法import其他文件
2020/02/12 Python
基于Python数据结构之递归与回溯搜索
2020/02/26 Python
Python 开发工具PyCharm安装教程图文详解(新手必看)
2020/02/28 Python
python 递归调用返回None的问题及解决方法
2020/03/16 Python
CSS 说明横向进度条最后显示文字的实现代码
2020/11/10 HTML / CSS
适合各种场合的美食礼品:Harry & David
2016/08/03 全球购物
照片礼物和装饰:MyPhoto
2019/11/02 全球购物
小学新教师培训方案
2014/02/03 职场文书
简历中的自我评价范文
2014/02/05 职场文书
施工安全责任书
2014/04/14 职场文书
考生诚信考试承诺书
2014/05/23 职场文书
小学捐书活动总结
2014/07/05 职场文书
机械操作工岗位职责
2014/08/08 职场文书
北京天坛导游词
2015/02/12 职场文书
发票退票证明
2015/06/24 职场文书