vue3 使用 elementUi: ./lib/theme-chalk/index.css is not exported from package

目录

  • 1. 在 vue3 中使用 element-ui
  • 2. 如果启动报错:Module not found: Error: Package path ./lib/theme-chalk/index.css is not exported from package

1. 在 vue3 中使用 element-ui

在 vue3 中使用 element-ui,我们的流程一般是这样的:

  1. 安装Element-Plus

    npm i element-plus -S
    
  2. main.js 中全局引入 element-plus

    import { createApp } from 'vue'
    import ElementPlus from 'element-plus';
    import 'element-plus/dist/index.css';
    import App from './App.vue'
    
    createApp(App).use(ElementPlus).mount('#app')
    
  3. 在 HelloWorld.vue 中测试一下

    <template>
      <div class="hello">
        <el-button type="primary">搜索el-button>
      div>
    template>
    
  4. npm run serve 跑一下服务
    vue3 使用 elementUi: ./lib/theme-chalk/index.css is not exported from package_第1张图片

2. 如果启动报错:Module not found: Error: Package path ./lib/theme-chalk/index.css is not exported from package

那就说明,main.js 中 element-plus 的 index.css 路径给配错了,这时候只需要打开 /node_modules/element-plus 去找到 index.css ,然后更改 main.js 中的路径就 OK 了。
vue3 使用 elementUi: ./lib/theme-chalk/index.css is not exported from package_第2张图片

你可能感兴趣的:(前端,vue,elementui)