下载本文档
版权说明:本文档由用户提供并上传,收益归属内容提供方,若内容存在侵权,请进行举报或认领
文档简介
【移动应用开发技术】微信小程序实时监听less文件编译成wxss文件的示例
这篇文章给大家分享的是有关微信小程序实时监听less文件编译成wxss文件的示例的内容。在下觉得挺实用的,因此分享给大家做个参考,一起跟随在下过来看看吧。
我们的微信小程序项目选择的技术栈是:原生+内嵌h6,技术选型没毛病,就是觉得哪里怪怪的。同样的设计稿,通常h6开发比小程序开发快,郁闷,为啥呀?小程序提供了很多封装好的组件,为什么开发起来还是效率低,找到问题的根源之一,小程序原生开发,样式使用的是wxss,不能使用嵌套语法,开发效率自然而然就打了折扣,后期wxss维护起来也比较麻烦。前世用wxss开发太慢了,微信小程序原生开发,我不想写wxss了。想着微信小程序都出来这么久,应该有成熟的方案来解决这个问题,于是我找到了以下几种方案。方案一:webstorm配置less自动编译这种方案适合使用webstorm编辑器开发者,无奈我现在钟情于VSCode(或者微信开发者工具,调试还是要用它),并不想使用webstorm,只好再寻觅其它的方案了。使用webstorm编辑器开发者可以按照以下参考文章配置。使用webstorm编辑器开发者可以按照以下参考文章配置。webstorm配置less自动编译webstormless文件编译成wxss文件配置方案二:用gulp-less自动编译引用gulp的任务流执行任务,gulp-less一个gulp自动化构件工具的一个插件,专门用来处理less文件使其产出css文件提供给生产环境使用。这种方案,可以用,还不太符合我的要求,我懒,不想手动编译啊。寻寻觅觅寻找到下一个解决方案。gulp-lessgulp打包处理less方案三:wxss-cli:全局命令行+路径终于找到一个还不错的解决方案,echo008开发的wxss-cli,这个工具全局安装后,运行wxss./path来将less编译成wxss。使用了一周发现,每天到公司开发,都需要先去拷贝要编译项目的目录,我不想每次都拷贝路径啊。并且编译的时候会把node_modules里的less也给编译。这样编译的速度就慢了。我只想,在我的项目根目录下面pages和components文件下编译,没有办法吗?这三种方案,没有一个用着顺手的今生于是我就给wxss-cli的作者提了issues,一周过去了作者没理我。等不了了,不行就自己上,扒源码,改成了符合我要求的。那个目录需要编译less,就在哪个文件目录下,执行命令less-to-wxsswatch,进行实时监听,将less自动转换成wxss文件。用着甚是顺手。我又给作者留了issus,没理我,好像其它几个issus也没理,可能作者太忙了没顾上。终于支持多个终端里面执行less-to-wxsswatch了。这个插件对于小程序原生开发的猿猿们来说,真是太好用了。一个插件就新鲜出炉了。需要的自取。less-to-wxss的npm包less-to-wxssless-to-wxss的优点:不用传路径全局安装,一键编译less-to-wxsswatch自持多终端,多目录使用改进后的less-to-wxss的实现原理,通过输入命令,获取到当前位置路径,对改目录下的文件进行文件遍历监听,通过less工具将less编译成wxss,重命名后保存到原目录下。原less文件更新继续上述的流程操作。感谢各位的阅读!关于“微信小程序实时监听less文件编译
温馨提示
- 1. 本站所有资源如无特殊说明,都需要本地电脑安装OFFICE2007和PDF阅读器。图纸软件为CAD,CAXA,PROE,UG,SolidWorks等.压缩文件请下载最新的WinRAR软件解压。
- 2. 本站的文档不包含任何第三方提供的附件图纸等,如果需要附件,请联系上传者。文件的所有权益归上传用户所有。
- 3. 本站RAR压缩包中若带图纸,网页内容里面会有图纸预览,若没有图纸预览就没有图纸。
- 4. 未经权益所有人同意不得将文件中的内容挪作商业或盈利用途。
- 5. 人人文库网仅提供信息存储空间,仅对用户上传内容的表现方式做保护处理,对用户上传分享的文档内容本身不做任何修改或编辑,并不能对任何下载内容负责。
- 6. 下载文件中如有侵权或不适当内容,请与我们联系,我们立即纠正。
- 7. 本站不保证下载资源的准确性、安全性和完整性, 同时也不承担用户因使用这些下载资源对自己和他人造成任何形式的伤害或损失。
最新文档
- 《科学真有趣导学案-2023-2024学年科学人教鄂教版》
- 《衣服的故事作业设计方案-2023-2024学年小学科学沪教版》
- 专题复习-2018年初中数学易错题分类-5月11日
- 关于团圆的英语作文
- 2012年9月公共英语三级试题及答案-文档
- 2011-2017新课标1卷理科数学分类汇编(立体几何)-文档
- 小儿静脉穿刺技巧课件
- 小儿肠炎并尿路感染课件
- 电子技术试题及答案-文档
- 幼教培训课件:《早期阅读的理念与实践》
- 国家开放大学《财务管理》综合练习参考答案
- 内审试卷求答案
- 苏教版四年级数学上册公开课“平均数”教案设计
- 小学生人民币教具(共5页)
- 全站仪使用手册全站仪说明书
- 三菱变频器e700使用手册基础篇
- 师德师风专题讲座材料教学提纲
- 苏教版五年级数学下册全册教案(完整版)教学设计含教学反思
- Matlab环境中16-QAM的性能仿真
- 资产清查盘亏情况说明范文
- 公文写作报告.ppt
评论
0/150
提交评论