浏览器环境使用less

在W3cschool上看的less教程中说在浏览器上使用less只需要两步即可：

 

 我照着引入后，直接双击html文件用浏览器打开后没看到效果，出现如下跨域错误：

如果不用link标签引入，改成style标签包裹放在head标签下，就没有问题了：

 

浏览器正常运行：

 

 如果不直接在浏览器打开html文件，而是改用本地服务器访问页面，是否能正常出现效果？于是，我用node写了一个server,文件目录如下：

server,js:

 

html文件中把原来的style标签及其包裹的内容去掉，改成link标签引入同目录下的style.less，保存后启动服务器，页面报错：

 

 不知道为什么找不到同目录下的style.less文件！

 后来发现原来是服务器这边没有设置静态资源，加上去就可以了。

 

 

使用node server.js命令开启服务器后，浏览器地址栏上输入：http://127.0.0.1:8081/ 就可以看到页面正常显示。

总结：

　　1、html文件中引入.less文件和less.js文件的顺序不要颠倒；

　　2、link标签中rel属性值不要漏了/less；

　　3、直接双击html文件打开运行会报跨域错误，因此只能通过服务器来打开；