1. プラグインをインストールする
糸のインストールが少ないローダーが少ない
これは私がインストールしたバージョンです
2.babel.config.jsを変更する
module.exports = {
presets: ["@vue/cli-plugin-babel/preset"],
plugins: [
[
"import",
{
libraryName: "ant-design-vue",
libraryDirectory: "es",
style: "css", // style: true 时加载的是less文件
},
],
],
};
3. vue.config.js 設定を変更する
module.exports = {
css: {
// css预设器配置项
loaderOptions: {
less: {
modifyVars: {
// less vars,customize ant design theme
"primary-color": "#6F4FF2",
"link-color": "#6F4FF2",
},
javascriptEnabled: true,
// prependData: `@import "@src/...`, // 引用自定义的主色
},
},
},
devServer: {
open: true,
port: 8080,
host: "0.0.0.0",
https: false,
hotOnly: true,
disableHostCheck: true,
proxy: {
},
},
};
4.メインスタイル
インポートスタイル
import "ant-design-vue/dist/antd.less";