Знакомство с Vue CLI и пользовательскими компонентами

  • 1 минута

Несмотря на то, что можно создать целое приложение Vue.js в одном файле JavaScript, оно будет неуправляемым, если только не будет очень маленьким. Для поддержки разбиения приложения на более мелкие фрагменты Vue позволяет создавать компоненты. Компоненты — это стандартные многоразовые блоки, из которых можно создать приложение.

Компоненты можно создавать как файлы JavaScript или с помощью одного файла с расширением .vue. Однофайловые компоненты используют специальный синтаксис, который браузеры не могут читать. Этот синтаксис должен быть преобразован в соответствующий код JavaScript, HTML и CSS. Процесс преобразования специального синтаксиса в то, что может быть прочитано браузером, называется объединением и требует дополнительных средств, таких как webpack.

К счастью, Vue также предоставляет интерфейс командной строки (CLI), который можно использовать для начальной загрузки приложения. CLI настраивает все необходимые средства, включая средство создания пакетов и сервер разработки.

В этом модуле мы изучим следующие задачи:

  • Использование Vue CLI для создания приложения.
  • Создание однофайловых компонентов.
  • Использование свойств для передачи значений в компоненты.

Необходимые условия:

  • Базовое представление о Vue.js
  • Знакомство с HTML и CSS
  • Знание JavaScript
  • Знакомство с Vue.js и директивами
  • Visual Studio Code
  • Node.js

Примечание.

Чтобы получить код решения для этого модуля, можно клонировать репозиторий, выполнив следующую команду в командной строке или окне терминала:

git clone https://github.com/MicrosoftDocs/mslearn-vue-components
cd mslearn-vue-components/end
code .