vue3中ElementUI plus使用
vue3中ElementUI plus使用
·
1.创建Vue项目后目录如下:
2.HomeView.vue
<div class="home">
<img alt="Vue logo" src="../assets/logo.png">
<el-button type="success" round>Success</el-button>
<HelloWorld msg="Welcome to Your Vue.js App"/>
</div>
</template>
<script>
// @ is an alias to /src
import HelloWorld from '@/components/HelloWorld.vue'
export default {
name: 'HomeView',
components: {
HelloWorld
},data(){
return {
msg: "hello bro"
}
}
}
</script>
3.main.js
import App from './App.vue'
import router from './router'
import ElementPlus from 'element-plus'
import 'element-plus/dist/index.css'
import store from "core-js/internals/shared-store";
const app = createApp(App)
//createApp(App).use(router).mount('#app')
createApp(App).use(store).use(router).use(ElementPlus).mount('#app')```
4.package.json
```{
"name": "vue1",
"version": "0.1.0",
"private": true,
"scripts": {
"serve": "vue-cli-service serve",
"build": "vue-cli-service build"
},
"dependencies": {
"core-js": "^3.8.3",
"element-plus": "^2.2.16",
"vue": "^3.2.13",
"vue-router": "^4.0.3"
},
"devDependencies": {
"@vue/cli-plugin-babel": "~5.0.0",
"@vue/cli-plugin-router": "~5.0.0",
"@vue/cli-service": "~5.0.0",
"babel-plugin-import": "^1.13.5"
},
"browserslist": [
"> 1%",
"last 2 versions",
"not dead",
"not ie 11"
]
}
5.vue.config.js
module.exports = defineConfig({
transpileDependencies: true
})
更多推荐
已为社区贡献1条内容
所有评论(0)