Установка VueJs

• javascript
• vuesj

Прелюдия

Конечно, изначально я думал, что просто поставлю какой-то там npm, какую-то версию в репах убунты, мне много не надо.

sudo apt install npmnpm install -g @vue/cli

Почему, я всегда думаю типа: ща побыстрому поставлю, потыкаю и спать, и всегда в итоге полночи кавыряюсь?

В общем сыпануло ошибок...

Error: EACCES: permission denied, mkdir '/usr/local/lib/node_modules'

Нормальный кодер бы от sudo выполнил и спать пошел, но я в Сибири вырос и мог что-то отморозить... Повозился с правами, и получил какие-то другие ошибки на джаваскриптном. Еще сказали, что у меня там все устарело, и попросили обновить, и я обновил, и ошибок стало больше.

Вода

Ты может быть уже давно в JS и в теме, что и как ту разворачивается, но я завязал еще во времена споров, что курче Jquery или MooTools. Кто победил в той войне, сейчас уже понятно, но как ты понимаешь ни какого nodeJs еще и в зародыше не было.

У меня были проблемы с версиями npm, кто-то достал проект из комода, там чуть ли ни бэта vuejs была, и пришлось на машине два npm поднимать. Да, я тут немного соврал, что прямо совсем не тыкал.

Установка npm

Вспомнил, что эта штука называлась nmv (node veriosn manager). Она изолирует установку разных версий ноды, значит мы не будем парится с правами и версиями. Свежие ссылки на гитхабе.

Кстати, если вы тот счастливчик который гамает и кодит в одном месте, т.е. под виндой, то вам сюда, там установка nvm под Windows.

curl -o- https://raw.githubusercontent.com/nvm-sh/nvm/v0.39.7/install.sh | bashcommand -v nvm

Последняя команда, для проверки установки nvm. У меня промолчала, ну либо не хочет расстраивать, либо всё хорошо.

nvm install node

Теперь, мы установили последнюю версию npm и nodeJs. Хотя, это я так устанавливаю, а люди с образованием, устанавливают NodeJS, а Node Package Manager (npm) идет прицепом, ведь это просто отпрыск от NodeJS. Но, мне это не интересно, мне нужно поставить npm, чтобы оттуда достать VueJs.

Я такой радостный, запустил команду на установку последней версии ноды:

Command 'nvm' not found, did you mean:

Я тут не did не mean, зато краем глаза в доке на гите видел траблшутинг (вот америкосы, шутингов им не хватает). Ну и раз команда не найдена, значит изменения которые внес nvm своим баш скриптом мне не подтянулись. Подтянем.

source ~/.bashrcnvm install node

Всё, установилося. Ага, установи лося... Дока у vue прекрасная и является преимуществом перед тем же реактом. Там я нашел рекомендацию использовать cli, типа с ним потом проще жить и его не зря придумали, так и сделаем.

Обратите внимание, есть ли у вас сообщение в терминале.

Your user’s .npmrc file (${HOME}/.npmrc)has a `globalconfig` and/or a `prefix` setting, which are incompatible with nvm.Run `nvm use --delete-prefix v22.3.0` to unset it.

Вероятно, это из-за прошлых попыток установить npm. Выполните: nvm use --delete-prefix v22.3.0

Установка VueJS

npm install -g @vue/cli

Меня часто спрашивают, почему компания которая сделала Ведьмака называется CD PROJECT RED, это не просто, что они старые игры реанимирровали, типа на дисках, это еще и переход в папку с проектом, я надеюсь, это верное предположение и красивая отсылка разработчиков к рутине.

cd /project/red

Теперь создадим проект VueJs. Переходим (или создаем) в директорию, где не пылятся наши 100500 проектов и создаем новый пет-проджект (cd project pet).

cd /projectsvue create my-project

Во время установки я выбрал "Default ([Vue 3] babel, eslint)". Я всегда ставлю всё самое свежее, потом парюсь с тем, что в свежем свежие проблемы, которые еще не гуглятся, но ничего с собой поделать не могу.

Открываем в своем любимом редакторе наш проект, стартуем сервер и наслаждаемся.

Так, стоп. Как стартовать-то? Идем в package.json и смотрим что там в секции scripts.

"serve": "vue-cli-service serve","build": "vue-cli-service build","lint": "vue-cli-service lint"

• serve - запускаем сервер (то, что нужно)
• build - для создания продакшн билда
• lint - прогнать линт, чекнет что ваш код хорош.

В файле README.md, это все замечательно описано и можно ни куда не ходить.

npm run serve

А я буду решать вновь возникшие ошибки.

Траблшутинг

После установленного npm и создании проекта vuejs получаем ошибку.

Command 'npm' not found, but can be installed with

Проверяем какую версию сейчас содержит nvm.

nvm current> none

Ага, ни какую, а какие вообще есть?

nvm list> v22.3.0

Хорошо, используем и понимаем в чем проблема.

nvm use v22.3.0Run `nvm use --delete-prefix v22.3.0` to unset it.

Я добавил в статью описание этой проблемы. Нужно просто выполнить, что оно просит.

Всё! Удачи, счастья, любви и хорошего коддинга )