Vue3初识

vue3使用记录心得

• 相关技术文档
  1. vue3 官网
  2. element-plus 官网

安装脚手架及ui库的按需加载

1. 使用vue/cli脚手架安装 安装@vue/cli4以上的版本
2. vue create vue3_project
3. 选择对应的包, vuex-router-css预处理器等

• 按需使用element-plus组件库

1. 下载element-plus安装包

    npm i element-plus -S

2. 按需加载组件库

• 与src同级新建plugins文件夹,新建element.js - 代码如下 -

import { ElButton, ElMessage } from 'element-plus'
import 'element-plus/lib/theme-chalk/index.css'
const components = [ElButton, ElMessage]
export default (Vue) => {
    components.forEach(item => {
        Vue.use(item)
    })
}

• 再在入口文件引入element.js

import initElement from './plugins/element'
const app = createApp(App)
initElement(app)

app.use(store).use(router).mount('#app')

• 组件内使用即可