VueJS - Настройка среды
Есть много способов установить VueJS. Некоторые способы выполнения установки обсуждаются заранее.
Использование тега <script> непосредственно в файле HTML
<html>
<head>
<script type = "text/javascript" src = "vue.min.js"></script>
</head>
<body></body>
</html>
Перейти на домашний сайт https://vuejs.org/v2/guide/installation.htmlVueJS и загрузите vue.js по мере необходимости. Есть две версии для использования - производственная версия и версия для разработки. Версия для разработки не свернута, тогда как производственная версия свернута, как показано на следующем снимке экрана. Версия для разработки поможет с предупреждениями и режимом отладки во время разработки проекта.
Использование CDN
Мы также можем начать использовать файл VueJS из библиотеки CDN. Связьhttps://unpkg.com/vueпредоставит последнюю версию VueJS. VueJS также доступен на jsDelivr (https://cdn.jsdelivr.net/npm/vue/dist/vue.js) и cdnjs (https://cdnjs.cloudflare.com/ajax/libs/vue/2.4.0/vue.js).
При необходимости мы можем разместить файлы на нашем конце и начать разработку VueJS.
Использование NPM
Для крупномасштабных приложений с VueJS рекомендуется устанавливать с помощью пакета npm. Он поставляется с Browserify и Webpack вместе с другими необходимыми инструментами, которые помогают в разработке. Ниже приводится команда для установки с помощью npm.
npm install vue
Использование командной строки CLI
VueJS также предоставляет интерфейс командной строки для установки vue и начала активации сервера. Для установки с помощью CLI нам необходимо установить CLI, что выполняется с помощью следующей команды.
npm install --global vue-cli
После этого отображается версия CLI для VueJS. Установка займет несколько минут.
+ [email protected]
added 965 packages in 355.414s
Ниже приводится команда для создания проекта с помощью Webpack.
vue init webpack myproject
Для начала используйте следующую команду.
cd myproject
npm install
npm run dev
Как только мы выполняем npm run dev, он запускает сервер и предоставляет URL-адрес для отображения в браузере, как показано на следующем снимке экрана.
Структура проекта с использованием CLI выглядит следующим образом.