angular@^6项目sass改less，修复ng-zorro升级@^1.1.0版本,定义主题中出现的less bug

全新的的angular@^6项目有全新的配置文件angular.json，@<6版本的配置文件为angular-cli.json，其结构已经发生很大的变化，下面是基于angular@^6版本sass改less，并经过less变量自定义ng-zorro的主题的方法和碰到的一些less问题

修改angular.json文件 schematics.@schematics/angular:component.styleext = less

"schematics": {
    "@schematics/angular:component": {
      ......
      "styleext": "less"
    },
    
  }

修改angular.json文件architect下面的builder中的指定项目构建时导入的样式文件改成你自定义的less文件

"styles": [
              "src/styles/styles.less"
            ],

相应的文件，小伙伴先注意styles.less这个文件，styles.var.less这两个文件和其余文件夹后面一一说一下

下面是新自定义的styles.less文件

@import "../../node_modules/ng-zorro-antd/src/ng-zorro-antd.less";  //引入ng-zorro的样式   
@import './styles.var.less';   //自定义的less变量和覆盖ng-zorro的官方变量   
@import "......";  //进入其余样式，这些样式能够根据业务细分建成相应的文件夹和文件，如图

这时候运行项目会包以下错误，大致是 bezierEasingMixin()函数很差使 javascript被禁用，解决方法，在
node_modules\@angular-devkit\build-angular\src\angular-cli-files\models\webpack-configs\styles.js line 136和142行（因为版本不同文件的位置也不同），lessPathOptions这个对象，加入属性lessPathOptions.javascriptEnabled = true

let lessPathOptions = { paths: [], javascriptEnabled: true};
    if (......);
        lessPathOptions = {
            paths: includePaths,
            javascriptEnabled: true
        };
    }

如今项目就能完美运行了，接下来就能够按照ng-zorro的官方教程作自定义样式和字体本地化了

👍👍👍👍👍若是能帮助到小伙伴的话欢迎点个赞👍👍👍👍👍
👍👍👍👍👍若是能帮助到小伙伴的话欢迎点个赞👍👍👍👍👍