Как развернуть мое веб-приложение vue.js с помощью виртуальной машины? - PullRequest
Новая
       35

Как развернуть мое веб-приложение vue.js с помощью виртуальной машины?

0 голосов
/ 30 апреля 2019

Я новичок в веб-разработке, и у меня возникают проблемы с развертыванием веб-приложения.

Контекст:

У меня есть работающее веб-приложение, которое состоит из:

1) front-end: написано в vue.js, я использовал npm run serve для запуска

2) back-end: написано на Джанго. Я использовал python manage.py runserver для запуска

Поскольку приложение использует вычисления на GPU, я должен запустить его на своем сервере отдела. Чтобы просмотреть его, я использую переадресацию порта SSH для пересылки как внешнего интерфейса, так и внутреннего на мой локальный хост (чтобы я мог получить к нему доступ с локального хоста: 16006). Это работает.

Теперь мне нужно развернуть этот сайт для общественности. Мой отдел настроил для меня виртуальную машину (VM) Ubuntu 18.04.2 (используя ufw в качестве программного обеспечения брандмауэра и разрешая все исходящие соединения и входящие ssh, http и https):

layout2im.cs.ubc.ca

Проблемы

Я вытащил свой код на эту виртуальную машину и установил соответствующие зависимости / пакеты. Для внешнего интерфейса я настроил vue.config.js так: 

const BundleTracker = require("webpack-bundle-tracker");

module.exports = {
    publicPath: '',
    outputDir: './dist/',

    chainWebpack: config => {

        config.optimization
            .splitChunks(false)

        config
            .plugin('BundleTracker')
            .use(BundleTracker, [{filename: '../frontend/webpack-stats.json'}])

        config.resolve.alias
            .set('__STATIC__', 'static')

        config.devServer
            .public('https://layout2im.cs.ubc.ca:80')
            .host('0.0.0.0')
            .port(80)
            .hotOnly(true)
            .watchOptions({poll: 1000})
            .https(true)
            .headers({"Access-Control-Allow-Origin": ["\*"]})
            .open(true)
    }
};

Тогда я npm run serve, и он сказал, что приложение работает на 

App running at:
  - Local:   https://localhost:1024
  - Network: https://layout2im.cs.ubc.ca:80/

Но я не могу открыть https://layout2im.cs.ubc.ca:80/ в браузере. (Я пробовал порт 443, и он тоже не работает)

Этот сайт недоступен
layout2im.cs.ubc.ca отказался подключиться.

(я не знаю, относится ли это к делу, но я тоже пытался npm run build, а dist/index.html содержит: 

<noscript><strong>
We're sorry but frontend doesn't work properly without JavaScript enabled. Please enable it to continue.
</strong></noscript>

)

Я даже не уверен, нахожусь ли я на правильном пути. Было бы замечательно, если бы кто-то мог указать на мои ошибки и на то, как я должен правильно использовать виртуальную машину для развертывания этого веб-сайта. (например, мне нужен Docker?)

...