less中的文件无效

Question

如图一所示为div结构，图2的Less文件夹，里面自定义了@lineColor后面引入不生效。而且在父类下面的子类的样式也不生效。我是用localhost打开的。求解

Answer 1

$ lessc styles.less styles.css

把.less文件编译成.css文件再引入css文件

webpack可以用less-loader

Answer 2

打开服务器，用Localhost打开当前页面，就解决了