Дружеское напоминание: эта статья была написана 16 мая 2020 г., и возникшие проблемы могут исчезнуть при последующих обновлениях. Я желаю vue все лучше и лучше.
Информация об установке и версии
Позвольте мне сначала перечислить информацию о моей версии:
- @vue/cli 4.3.1
- node v12.16.3
- yarn 1.10.1
Процесс установки
vue create xxxx
// 进行你自己的配置
cd xxxx //进入你刚刚的项目
vue add vue-next // 配置vue 3!
// 如果你选了ts,你会得到一个无法正常运行的helloworld。
Ниже приведена информация о версии всего семейства Vue:
- "vue-cli-plugin-vue-next": "~0.1.2"
Приведенный выше плагин автоматически исправил это для меня:
- "vue": "^3.0.0-beta.1",
- "vue-router": "^4.0.0-alpha.5",
- "vuex": "^4.0.0-alpha.1"
прибраться
src/shims-tsx.d.ts
Одно слово: удалить! Происхождение практики:GitHub.com/v UE JS/v UE-вы…
src/shims-vue.d.ts
Измените его на:
declare module '*.vue' {
import { ComponentOptions } from 'vue'
var component: ComponentOptions
export default component
}
Происхождение практики:GitHub.com/v UE JS/v UE-вы…
src/store/index.ts & main.ts
Эти два файла меняются вместе, предыдущий файл перемещается, и задний тоже перемещается~ index.ts изменен на:
import { createStore } from 'vuex'
export const store = createStore({
state () {
return {
count: 1
}
}
})
Раздел ссылок на main.tsimport store from './store'изменить наimport {store} from './store'Происхождение практики:
Написано в файле README.md под node_mudules!
src/router/index.ts
Из-за этой конфигурации или чего-то еще, я не знаю, почему его нельзя распознать, поэтому я его не узнаю~
import { createRouter, createWebHistory } from 'vue-router';
import Home from '../views/Home.vue'
const routes: Array<any> = [
{
path: '/',
name: 'Home',
component: Home
},
{
path: '/about',
name: 'About',
// route level code-splitting
// this generates a separate chunk (about.[hash].js) for this route
// which is lazy-loaded when the route is visited.
component: () => import(/* webpackChunkName: "about" */ '../views/About.vue')
}
]
const router = createRouter({
history: createWebHistory(process.env.BASE_URL),
routes
})
export default router
Источник: самодельный
Последний: src/components/HelloWorld.vue
Это связано с изменениями в vue3, поэтому часть сценария изменена на:
<script lang="ts">
export default {}
</script>