VUE按需引入ANT DESIGN报错“ERROR IN ./NODE_MODULES/ANT-DESIGN-VUE/ES/EMPTY/STYLE/INDEX.LESS”解决办法

今天测试下ant design 运行后，报错了一、报错如下：errorin ./node_modules/ant-design-vue/es/empty/style/index.less@ ./node_modules/ant-design-vue/es/select/style/index.less 4:14-207 14:3-18:5 15:22-215@ ./node_modules/ant

时光机上敲代码

4627人浏览 · 2021-07-13 15:35:55

时光机上敲代码 · 2021-07-13 15:35:55 发布

今天测试下ant design 运行后，报错了

一、报错如下：

 error  in ./node_modules/ant-design-vue/es/empty/style/index.less

 @ ./node_modules/ant-design-vue/es/select/style/index.less 4:14-207 14:3-18:5 15:22-215
 @ ./node_modules/ant-design-vue/es/select/style/index.js
 @ ./node_modules/ant-design-vue/es/pagination/style/index.js
 @ ./src/plugins/ant-design-vue.js
 @ ./src/main.js
 @ multi (webpack)-dev-server/client?http://192.168.1.192:8080&sockPath=/sockjs-node (webpack)/hot/dev-server.js ./src/main.js

二、解决方案

1、安装LESS和LESS-LOADER

npm install less less-loader --save

2、修改BABEL.CONFIG.JS

将中的style: true修改为"style": ‘css’，修改后内容如下

module.exports = {
  "presets": [
    "@vue/cli-plugin-babel/preset"
  ],
  "plugins": [
    [
      "import",
      {
        "libraryName": "ant-design-vue",
        "libraryDirectory": "es",
        "style": 'css'
      }
    ]
  ]
}