Начало работы
Добро пожаловать в учебник по Vue!
Цель этого руководства — дать быстрое представление каким образом можно работать с Vue в браузере. Оно не стремится быть всеобъемлющим, и вам не нужно понимать всё, прежде чем двигаться дальше. Но после его завершения рекомендуем прочитать Руководство, где рассматривается каждая тема подробно.
Предварительные требования
Этот учебник предполагает базовое знакомство с HTML, CSS и JavaScript. Если вы совсем новичок в разработке фронтенда, возможно, не стоит сразу бросаться на фреймворк в качестве первого шага - изучите основы, а затем возвращайтесь! Предварительный опыт работы с другими фреймворками поможет, но не обязателен.
Как использовать этот учебник
Вы можете редактировать код справа внизу и видеть, как результат мгновенно обновляется. На каждом шаге будет представлена одна из основных возможностей Vue, и от вас потребуется доработать код, чтобы демонстрация заработала. Если вы застрянете, у вас будет кнопка "Показать!", которая покажет вам рабочий код. Постарайтесь не слишком полагаться на нее - вы быстрее научитесь, если будете разбираться во всем самостоятельно.
Если вы опытный разработчик, пришедший из Vue 2 или других фреймворков, можете изменить несколько настроек, чтобы наилучшим образом использовать этот учебник. Если у вас мало опыта, рекомендуется использовать настройки по умолчанию.
Подробности настройки учебника
-
Vue предлагает два стиля API: Options API и Composition API. Справочник API разработан для работы с любым - вы можете выбрать предпочитаемый стиль, используя переключатели Предпочитаемый стиль API вверху. Узнайте больше о стилях API.
-
Вы также можете переключаться между SFC-режимом и HTML-режимом. В первом будут показаны примеры кода в формате Однофайловые компоненты (SFC), который используется большинством разработчиков при использовании Vue на этапе сборки. HTML-режим показывает использование без этапа сборки.
TIP
Если вы хотите использовать HTML-режим без этапа сборки внутри ваших приложений, убедитесь, что вы также поменяли импорты
import { ... } from 'vue/dist/vue.esm-bundler.js'
внутри ваших скриптов, или настройте ваш сборщик так, чтобы он мог обработать vue
. Небольшой конфиг для Vite:
// vite.config.js
export default {
resolve: {
alias: {
vue: 'vue/dist/vue.esm-bundler.js'
}
}
}
Посмотрите соответствующий раздел в руководстве по инструментарию для большей информации.
Готовы? Нажмите "Далее", чтобы начать работу.