少文件编译成一个微信的小程序wxss文件

2016年9月21日，微信的小程序的内部测试正式开启，微信生态下，微信的小程序，这是准备跑出去，引起了广泛的关注和引爆朋友圈。在这样一个炎热的气氛，作为前端开发的我，也悄然尝鲜。



在做演示的小例子的过程中，我发现了一个非常尴尬的事情：*如何把不 / SASS文件到一个wxss文件的小程序* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * *）



我基本上不使用本地CSS，我习惯于少写，这使我的风格写得很难。



在尝试配置的考拉，一个工具，可以编译不 /萨斯，并寻找各种数据，是一个可行的方法终于找到了。我少带为例，与大家分享。Sass也是可行的。



环境要求：



- webstrom

- Nodejs



具体步骤



1。使用Nodejs命令来安装少。



进入Nodejs命令窗口：NPM少安装- G，然后安装回去。如下：







2.webstrom配置



1）。打开webstrom设置，文件->设置。



2）。展开左侧列表中的最后一项并找到文件监视程序。我们可以在右边看到白色框，然后单击Add图标并选择较少。





3）。在打开框中，我们可以看到一些相关的配置。我们不用去管，我们只需要注意两个地方：路径和程序的输出路径，程序路径是较少的路径，我安装之前，和输出路径修改变更原来的CSS to.wxss.as如下：





4）。保留确认。



三.验证



1）。我们验证效果的编辑。添加少的文件，我们会发现，编辑器自动添加相应的wxss文件给我。



2）。写更少的文件，然后保存，再打开wxss文件，发现编译成功，那么我们所做的工作。





等uff01our wxss看起来很糟糕！



人们不惊慌，有一个解决办法：



1）。打开webstrom设定和查找文件和代码模板。在编辑器下面：





2）。单击添加图标，在扩展名框中输入wxss，然后单击应用。





3）。在弹出的文件类型框中，选择CSS。





4）。打开我们的wxss发现CSS一样。





在这里我只是少用为例，SASS是相同的。如果你需要，你可以自己做。

谢谢你的阅读。我希望你能帮助你，谢谢你对这个站的支持。