antd less加载报错.bezierEasingMixin()解决

环境介绍

vue + ts + antd

• package.json文件展示

"dependencies": {
    "@antv/data-set": "^0.11.1",
    "@antv/g2": "^4.0.0",
    "@antv/g2plot": "^0.11.33",
    "@types/mockjs": "^1.0.2",
    "@types/vue-ls": "^3.2.1",
    "ant-design-vue": "^1.4.11",
    "axios": "^0.19.2",
    "core-js": "^3.6.4",
    "less-loader": "^5.0.0",
    "mockjs": "^1.1.0",
    "nprogress": "^0.2.0",
    "viser-vue": "^2.4.8",
    "vue": "^2.6.11",
    "vue-class-component": "^7.2.2",
    "vue-cropper": "^0.5.0",
    "vue-ls": "^3.2.1",
    "vue-property-decorator": "^8.3.0",
    "vue-router": "^3.1.5",
    "vuex": "^3.1.2",
    "vuex-class": "^0.3.2"
  },
  "devDependencies": {
    "@typescript-eslint/eslint-plugin": "^2.18.0",
    "@typescript-eslint/parser": "^2.18.0",
    "@vue/cli-plugin-babel": "~4.2.0",
    "@vue/cli-plugin-eslint": "~4.2.0",
    "@vue/cli-plugin-router": "~4.2.0",
    "@vue/cli-plugin-typescript": "~4.2.0",
    "@vue/cli-plugin-vuex": "~4.2.0",
    "@vue/cli-service": "~4.2.0",
    "@vue/eslint-config-standard": "^5.1.0",
    "@vue/eslint-config-typescript": "^5.0.1",
    "eslint": "^6.7.2",
    "eslint-plugin-import": "^2.20.1",
    "eslint-plugin-node": "^11.0.0",
    "eslint-plugin-promise": "^4.2.1",
    "eslint-plugin-standard": "^4.0.0",
    "eslint-plugin-vue": "^6.1.2",
    "less": "^3.0.4",
    "less-loader": "^5.0.0",
    "typescript": "~3.8.3",
    "vue-template-compiler": "^2.6.11"
  }

完整报错信息如下：

// https://github.com/ant-design/ant-motion/issues/44
.bezierEasingMixin();
^
Inline JavaScript is not enabled. Is it set in your options?
      in F:\iBlockChain\iblockchain-client\node_modules\ant-design-vue\lib\style\color\bezierEasing.less (line 110, column 0)

解决方法

• 在vue.config.js文件中添加以下配置：

module.exports = {
  ...
  css: {
    loaderOptions: {
      less: {
        javascriptEnabled: true,
      }
    }
  }
  ...

至此，问题解决