开发者学堂课程【移动 Web 前端开发:less-模版配置】学习笔记,与课程紧密联系,让用户快速学习知识。
课程地址:https://developer.aliyun.com/learning/course/594/detail/8483
less-模版配置
选择 File 菜单,在下拉列表选择打开 Settings 设置,点开 Tools,选择 File Watchers,可以看见右上角有一个+号,点开,加一个 less。勾选 less。保存。
这里,就能确定编译没有问题。
注意选择正确的语法,有语法检查的。
在 Project 对话框下选中 lessStudy 文件,右击,点 New, 这里可以发现下拉列表里面直接有一个 less 的文档类型,
新建一个名为 test.less 打开,可以看到直接默认就生成了 @charset "utf- 8"; 的文档。这里没有模板配置。
比如,新建一个 1.html 的文档
打开:
< !DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title></ title>
< /head>
<body>
k</body>
< /html>
可以看到,这里是有模板配置的。
test.less 的文档需要配置模板。怎么配?
在 lessSyudy 文 件右击,点开 File and Code Templates 模板,在 Templates 下属列表里有 less 的文件,但是没法使用。
左上角有一个加号,点击左上角的+号,选择 Unnamed 新建
模板名称为 less plus ,Extension: less 应用于 less 文件, 在下方空白区域粘贴
默认为: @charset "utf- 8";模板文档。
这个作用是确定字符编码不会乱码。点同意,再点击确认。
这样,在 lessSyudy 的新建菜单栏下也有一个 less plus 文件类型了。
然后点击 less plus,新建名为 test(这里就不用写后缀名了)的 less 文件,打开就能看见 @charset "utf- 8";默认的字符。
过一会,就能自动编译生成相应的 CSS 文件 test.css。
这就是 less 的模板配置方法。