webstorm 中 html使用less报错

最初使用的是css文件没有任何问题，使用lessc less/index.less css/index.css 把index.css 转成less文件进行引入后发现报错：

Refused to apply style from 'http://localhost:63342/cssworld/less/index.less' because its MIME type ('application/octet-stream') is not a supported stylesheet MIME type, and strict MIME checking is enabled.

原来是引用的是时候link标签中使用了rel="stylesheet" 去解析less文件，结果报错，把这个属性改变下即可，需要注意的是html引入less文件需要加载less.js对文件进行解析

<link rel="stylesheet" href="./less/index.less"> 

<link rel="stylesheet/less" href="./less/index.css">
<script src="//cdnjs.cloudflare.com/ajax/libs/less.js/2.5.3/less.min.js"></script>

如果使用webstorm开发，webstorm需配置file watchers 帮助我们将less文件转义成css文件，这样html直接引用css文件即可

PS： 参考文档

webstorm 配置less解析参考 https://www.cnblogs.com/haley168/p/webstorm_less.html

<link>便签用法 http://www.w3school.com.cn/tags/tag_link.asp

 

当我继续学习less的高级用法时，比如在里面可以直接执行js函数，计算后返回需要的参数，但是这时候webstorm编译报错了

error： Inline JavaScript is not enabled Is it set in your options？

上次遇到这个问题还是在自定义修改iview主题时，webpack打包报出来的错，错误原因less是3.x或者3.x以上的版本。当时解决的方法是less-loader 中加入配置less-loader加个options { loader: 'less-loader', options: { javascriptEnabled: true } }

但是这次遇到的问题有所不同，这次是用webstorm编译less文件，就想在file watcher中修改less的options，但是并没有找到，既然是版本的问题 于是只能把less的版本从最新的3.9.0改为2.7.1,果然改过版本就不会报错了。但是既然版本有更新，那果断要用最新的版本呀，于是又把less从2.7.1改为3.9.0了。本想再想办法解决这个问题的。没曾想wenstorm又不报错了。百思不得其解。。。。。。。。。

如果有碰到类似问题的小伙伴可以下面评论下，谢谢大大们。