Можно ли запустить сайт написанный на NodeJS без NodeJS?

Question

[beduin01]

NodeJS начал использовать менее месяца назад. В качестве веб-фреймворка использую Vue.JS. Есть стойкое желание Node JS использовать только для разработки, а хостить приложение на другом сервере (не на NodeJS).

Однако как я понял это невозможно. К примеру у Vue часть логики выносится в .vue файлы и NodeJS их сама подгружает каким-то образом как шаблоны. Правильно ли я понимаю, что основная проблема в том, что NodeJS реализует поддержку директивы export без которой подобную подгрузку невозможно реализовать, или есть какие-то еще моменты?

Есть ли возможность эмуляции этой директивы чтобы я мог запустить указанный код к примеру на IIS?

Answer 1

[amokrushin]

Node.js не подгружает никакие файлы *.vue (получите syntax error при попытке подключить .vue файл), этим занимается либо webpack c плагином vue-loader, либо browserify с плагином vueify, которые в свою очередь являются инструментами сборки клиентского кода в пакет (bundle) - отдельный файл в котором собран код со всеми зависимостями.
Этим инструментам для работы нужен Node.js, но то что у них получается на выходе, с node.js уже никак не связано - в этом коде не будет никаких require/export. Просто скопируйте эти файлы из директории build, подключите на страницу тегом script, link и хостите чем угодно, nginx, IIS. Разумеется речь идет только о клиентской части приложения.
Vue.js на ноду завязана только в одном месте - Server-Side Rendering, но это относится уже к серверной части приложения.

Comments

[beduin01]

Спасибо, а какой из подходов самый современный? Мне обратная совместимость со старыми браузерами не нужна.

[beduin01]

Просто я попробовал один из шаблонов веб-пака, и у меня не получилось подгрузить отдельный страницы определенные в vue файлах.

[beduin01]

Правильно ли я понимаю, что для сборки нужно выполнить команду: "npm run build" и все должно будет работать?

[amokrushin]

beduin01: Не очень понял вопрос про "современный". Здесь все современное. Подход зависит от масштабов приложения, так можно и в doker, continuous integration с головой уйти, забыв ту задачу которую пытался решить изначально.
Вам надо по шагам разобраться с тем что происходит. Как я понимаю основная проблема здесь именно webpack и его конфигурация, а не node.js. Да, это не самый простой инструмент, его действия порой не очевидны.
npm run build - это не какая-то встроенная команда npm/node.js, это скрипт который был кем-то написан, посмотреть что он выполняет можно в файле package.json в секции script, скорее всего что-то вроде "webpack", это значит он запустит webpack с конфигом по умолчанию из файла "webpack.config.js". Далее попытаться разобраться с файлом конфигурации вебпака, начиная с секции entry - это входные точки, для каждой такой точки будет создан файл в папке build, который будет иметь имя в соответствии с правилами в секции output.
Проблема в том что особой магии тут нет, и необходимые файлы нужно подключать на странице вручную (script, link), и когда у вас один файл, проблем обычно не возникает, просто подключили и все. Когда используется code splitting, асинхронная загрузка модулей, тогда и начинаются проблемы. Тут только два варианта, либо оставить все в одном файле и забыть про асинхронную загрузку модулей и упаковывать все в один единственный пакет (bundle) который загружать на каждой странице, либо потратить энное количество времени и разобраться с Code Splitting и тем как работает загрузчик модулей вебпака, экспериментируя на простых примерах и смотря код который получается после сборки.
Например, примерно так выглядит код загрузчика вебпака, который он добавляет к файлу сборки
https://gist.github.com/amokrushin/47b74e6191d96fc...
именно этот код исполняется в браузере и загружает модули асинхронно путем добавления нового тега script в заголовок страницы во время исполнения. Все require/export которые вы пишите в клиентском коде обрабатываются именно вебпаком на этапе сборки, node.js не имеет к ним отношения.
В том числе и асинхронная загрузка компонентов vue (https://vuejs.org/v2/guide/components.html#Async-C... - все это часть работы вебпака.

Answer 2

[Виталий]

Я вот только не пойму, вот делаю я фронтэнд реакта, пишу на js jsx , дальше инструментами собираю его в проект, эти инструменты интерпритируются через node.exe ,дальше готовый билд заливаю на сервер и раздаю через нгинкс или апач, все. Но если я использую коа, экспресс или сокет ио к примеру, я запускаю их как сервис в ноде и только так. Думаю все зависит от задачи.