欢送大家关注我的技术博客：style'me的集体博客
以下对于vue3x我的项目创立到启动的一些变动，供大家参考，如果您筹备应用3x版本作为我的项目开发，相干配置建议您降级到更高的版本，比方：

1、在3x版本中如果您应用element-ui，建议您抉择element-plus，这是专门为vue3x定制的版本
2、vue-router建议您降级到4.0版本以上，更好的兼容vue3x
3、vuex建议您降级到4.0版本以上，更好的兼容vue3x
4、若您想在我的项目中应用sass，建议您装置sass和sass-loader即可，sass-loader版本倡议在10.1.1版本，这样能力更好的兼容vue3x

/*装置element-plus*/cnpm install element-plus -S/*装置路由4.0版本以上*/npm install vue-router@4/*装置vuex4.0版本以上*/npm install vuex@4/*装置sass和sass-loader*/npm install sass sass-loader@10.1.1

1、装置区别

/*2x vue我的项目脚手架装置办法*/vue int webpack projectName/*3x vue我的项目脚手架装置办法*/vue create projectName

2、我的项目挂载区别

/*2x main.js挂载*/import Vue from "vue"import App from "./App.vue"new Vue({  render: h => h(App)}).$mount("#app")/*3x main.js挂载*/import { createApp } from "vue"import App from "./App.vue"createApp(App).mount("#app")

3、插件挂载和全局注册应用区别

/*2x 插件挂载和全局注册应用*/import Vue from "vue"import App from "./App.vue"Vue.use(ElementUI, axios,animated)/*2x注册全局插件应用prototype*/Vue.prototype.$echarts = echartsnew Vue({  render: h => h(App)}).$mount("#app")/*3x 插件挂载和全局注册应用*/import { createApp } from "vue"import App from "./App.vue"const app = createApp(App)/*3x注册全局插件应用app.config.globalProperties*/app.config.globalProperties.$echarts = echartsapp.use(ElementPlus,{locale})app.use(router)app.use(store)app.mount("#app")

上面图片是vue2x和vue3x再我的项目挂载和插件应用上得一些api的变动

4、路由注册创立区别

/*2x 路由注册创立*/import Vue from "vue"import VueRouter from "vue-router"/*RouterPage 是我本人的路由管理文件*/import RouterPage from "./RouterPage/"Vue.use(VueRouter)const router = new VueRouter({  mode: "hash",  base: process.env.BASE_URL,})router.addRoutes([...RouterPage]);export default router/*3x 路由注册创立*/import {createRouter,createWebHistory,createWebHashHistory} from "vue-router"import RoutersPage from "@/router/RouterPage/index"import RouterBase from "@/router/RouterPage/base"const router = createRouter({  history:createWebHashHistory(),  scrollBehavior: () => ({ y: 0 }),  routes:[...RoutersPage,...RouterBase]})export default router

上面的图片是vue-router的3x和4x版本的api对应变动

5、vuex创立区别

/*2x vuex创立*/import Vue from "vue"import Vuex from "vuex"export default new Vuex.Store({  state: {},  mutations: {},  actions: {},  modules: {}})/*3x vuex创立*/import { createStore } from "vuex";export default createStore({  state: {},  mutations: {},  actions: {},  modules: {}})

我的项目创立配置到启动根本波及这些须要留神的点，然而在应用过程中也有很多变动，比方：
在3x版本中如果 v-if 和 v-for 同时应用 v-if 的优先级永远是最高的，再比方：拜访子组件的 this.$children办法被勾销等等，这些在我的项目开发中常常用到，如果您有趣味能够移步与官网更深刻的学习，vue3x学习 https://v3.cn.vuejs.org/guide...