1

Зачем и когда нужен npm ?

Будет ли он работать на сервер или он не должен вообще работать на сервере ?

Какие шаги необходимо проделать чтобы создать одностраничное приложение используя Vue js на frontend и PHP на backend?

Допустим есть сайт. Серверная часть на PHP. Нужно сделать SPA используя Vue CLI. Можно ли использовать npm? Если да то КАК это сделать и будет ли оно работать на сайте ? Хостинг не поддерживает Node.js

P.s: Знаю много вопросов. НО мне нужно чтобы кто то расставил все по полочкам.

2 ответа 2

2

Давай начнем с того что у vue есть достаточно исчерпывающая документация тут. На счет npm (npm как и yarn) это менеджер пакетов как composer для php, через него ты можешь установить нужные тебе плагины и тд. Я так понимаю что ты хочешь использовать Vue + Laravel, если так то начиная с версии Laravel 6, работа с vue идет из коробки. Если я не прав то можно спокойно запустить бэк на субдомене (api.test.com), а фронт как test.com (с Laravel такой вариант тоже работает). С помощью axios стучаться по апи для получения или отправки данных. Что бы с помощью Vue Cli создать проект хватит простой команды vue init webpack-simple <имя проекта>. Тут описано более подробно. После выполнения простых шагов по типу указания имени проекта, автора и тд, (выбирается в консоли после ввода команды "vue init webpack-simple <имя проекта>"), вам нужно перейти в директорию с проектом выполнить npm install && npm run dev и все можете начинать работать с фронтом.

1

Зачем и когда нужен npm ?

Это - пакетный менеджер: установка / удаление пакетов. Также с помощью него часто запускают процесс сборки проекта, для этого в package.json есть секция scripts.

Нужен практически всегда для современных JS-приложений. Работает на NodeJS и ставится с ним (по крайней мере так в Ubuntu, Debian и CentOS).

Будет ли он работать на сервер или он не должен вообще работать на сервере ?

На шаред-хостинге - скорее всего нет, если явно не заявили об этом, или это не спец хостинг. Большинство хостингов построены на LAMP, а значит там PHP.

Можно сделать так: поставить NodeJS + npm на свою машину, вести на ней разработку (vue serve), а затем собрать проект (vue build) и выложить готовый JS на сервер. Серверу лишь нужно будет отдавать готовый JS для браузера. А на беке как вы сами сообщили, будет работать PHP.

Какие шаги необходимо проделать чтобы создать одностраничное приложение используя Vue js на frontend и PHP на backend?

  1. Ознакомиться с документацией Vue, пройти уроки

  2. Сделать пробное приложение без работы с серверной частью

  3. Добавить взаимодействие с сервером

Допустим есть сайт. Серверная часть на PHP. Нужно сделать SPA используя Vue CLI.

Vue CLI - это надстройка над npm, по сути - пакет npm на глобальном уровне. Можно сделать VueJS приложение без Vue CLI, используя только npm. Для этого нужно ознакомиться с работой npm, и желательно, webpack - это такой "сборщик".

Вот я скопировал и подсократил пример из Laravel (для других фреймворков все полностью аналогично):

{
    "scripts": {
        "dev": "npm run development",
        "development": "cross-env NODE_ENV=development node_modules/webpack/bin/webpack.js ...",
        "watch": "npm run development -- --watch",
        "watch-poll": "npm run watch -- --watch-poll",
        "prod": "npm run production",
        "production": "cross-env NODE_ENV=production node_modules/webpack/bin/webpack.js ..."
    },
    "devDependencies": {
        "axios": "^0.19",
        "sass": "^1.15.2",
    }
}

Разберем как это работает.

Если выполнить npm run dev, то запустится npm run development. А в нем указана переменная окружения для разработки NODE_ENV=development и запуск вебпака node_modules/webpack/bin/webpack.js. Веб-пак работает для новичка сложно, и я рекомендую использовать уже настроенное окружение, от того же Laravel.

В этом режиме произойдет сборка проекта для разработки, например можно отлаживать через Vue.js devtools.

При запуске npm run watch будет аналогичная сборка, но npm еще и будет висеть и наблюдать за изменениями в файлах проекта, делая пересборку проекта на лету. Крайне рекомендую этот режим.

Перед выкладкой на сервер, сделайте npm run prod, на выходе получите JS (+CSS) файлы, которые готовы к размещению на сервере.

Можно ли использовать npm? Если да то КАК это сделать и будет ли оно работать на сайте ? Хостинг не поддерживает Node.js

Ответил выше

Ваш ответ

By clicking “Отправить ответ”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.