vite+element-plus `buildModifiers`報錯

參考文檔：https://element-plus.gitee.io/#/zh-CN/component/quickstart

最近嘗試用vue3+vite+element-plus寫一個小demo，安裝完后，粘貼element-plus代碼發現了如下報錯:

后又重新看了一遍element-plus文檔，發現上面有vite的配置方法，而我遺漏了

跟着文檔上操作：

1. 安裝vite-plugin-style-import

根據文檔描述，還需要在vite.config.js中配置

2. 在vite.config.js中

import styleImport from 'vite-plugin-style-import'

export default defineConfig({
  plugins: [
    vue(),
    // 此為使用scss的配置
    styleImport({
      libs: [{
        libraryName: 'element-plus',
        esModule: true,
        ensureStyleFile: true,
        resolveStyle: (name) => {
          name = name.slice(3)
          return `element-plus/packages/theme-chalk/src/${name}.scss`;
        },
        resolveComponent: (name) => {
          return `element-plus/lib/${name}`;
        },
      }]
    })
  ]
})

3. 在main.js中

// 如果要使用.scss樣式文件，則需要引入base.scss文件
import 'element-plus/packages/theme-chalk/src/base.scss'
// 改為中文
import locale from 'element-plus/lib/locale/lang/zh-cn'

app.use(Element-plus,{locale})

修改過后，報錯消失啦！

PS：如果修改過后報錯還未消失，可能是版本問題哦，建議更換版本！