You Yuxi не рекомендует гаджет webpack для бета-версии vue3.0.

Vue.js

предисловие

Вечером 21 апреля автор Vue Ю Юйси поделился последним прогрессом бета-версии Vue.js 3.0 на Bilibili Live. Внутри Ю Да упомянул этот маленький инструмент, который он недавно сделал.vite, экспериментальный сервер разработки vue без сборки. (Этот гаджет может поддерживать горячие обновления без предварительной компиляции)

Раз уж вам интересно, попробуйте и начните

1. Установка

Скопируйте следующее из командной строки

  • mkdir vue-vite 新建文件夹
  • npm init -y 初始化项目
  • npm i vite -g 全局安装vite
  • npm i vue@next 安装vue3.0 beta版(После того, как друзья напомнили, он больше не нужен, теперьviteПринести свои собственныеvue 3.0 betaверсия)

2. Новый файл

Создайте новый файл в каталоге проекта

index.html

<div id="app"></div>
<script type="module" src="/main.js"></script>

Comp.vue

<template>
  <button @click="count++">{{ count }}</button>
</template>

<script>
export default {
  data: () => ({ count: 0 })
}
</script>

<style scoped>
button { color: red }
</style>

main.js

import { createApp } from 'vue'
import Comp from './Comp.vue'

createApp(Comp).mount('#app')

3. Старт

  • cd vue-vite 进入目录
  • vite 启动项目

Затем вы можете увидеть приглашение запуска командной строки

ctrl + щелчок левой кнопкой мыши, чтобы войти и увидеть такую ​​страницу, это означает, что вы успешно запустились

Затем вы можете попробовать изменитьComp.vueПосмотрите, настолько ли волшебный эффект, нет необходимости в предварительной компиляции и поддержка горячего обновления.

vite адрес нажмите здесь

Спасибо за прочтение. Если вы нашли эту статью полезной, пожалуйста, нажмите 💚 ниже.
Если у вас есть какие-либо вопросы, пожалуйста, оставьте сообщение

Категории