以vue为例, 同时安装 vue的2.6版本和 vue的3.2版本
首先分别起名 vue2 和 vue3
npm 安装
## npm 别名安装写法
npm install vue2@npm:vue@^2.6.14
npm install vue3@npm:vue@^3.2.37
yarn 安装
## yarn 别名安装写法
yarn add vue2@yarn:vue@^2.6.14
yarn add vue3@yarn:vue@^3.2.37
这里以 npm 为例,安装完成后可以看到 package.json 已经有两个新的包了
{
"dependencies": {
"vue2": "npm:vue@^2.6.14",
"vue3": "npm:vue@^3.2.37"
}
}
这样项目里就同时有2个版本的vue了, 都可以直接在项目内使用了
代码引入使用示例
// demo.js
import Vue from 'vue2'
import { createApp, reactive } from 'vue3'
// vue2 版本创建app
const vue2App = new Vue({
data() {
return {
text: 'Hello World!'
}
}
}).$mount('#app2')
// vue3 版本创建app
const vue3App = createApp({
setup() {
const state = reactive({
text: 'Hello World!'
})
}
}).mount('#app3')
其他
也可以选择一个普通安装, 一个起别名安装
npm install vue
npm install vue3@npm:vue@^3.2.37
package.json
{
"dependencies": {
"vue": "^2.6.14",
"vue3": "npm:vue@^3.2.37"
}
}
使用
import vue from 'vue'
import { createApp } from 'vue3