Как запустить производственную сборку на VueJs?

Я работал над проектом VueJs локально. Теперь мне нужно загрузить его на виртуальную машину моего университета, и он станет общедоступным. Я думаю, мне следует загружать не весь каталог, а только каталог dist, который я создал с помощью команды:

npm run build

Первый вопрос: это правильно?

Второй вопрос: как мне запустить сервер сейчас? Для локального теста я запускал его с помощью команды:

npm run serve

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

Спасибо за помощь.


vue.js dev-to-production
person francesco    schedule 09.01.2021    source источник

Ответы (3)


arrow_upward
2
arrow_downward

Ответ на вопросы:

  1. да. Это правильно.

  2. Обычно вам нужно обслуживать папку dist на веб-сервере. Например, nginx или apache.

Он будет работать с вашим index.html внутри папки /dist, созданной на этапе сборки вашего приложения vuejs.

Прим .: вы не должны обслуживать свое приложение в производстве с npm run serve, поскольку это однопоточный сервер разработки.

person Danizavtz    schedule 09.01.2021
comment
Спасибо за ответ. Как мне сервер с apache? На виртуальной машине есть другое приложение, обслуживаемое apache. Могу ли я сделать это удаленно или попросить администратора ВМ что-то сделать? - person francesco; 09.01.2021
comment
Вам просто нужно поделиться с администратором своей папкой dist, и он будет обслуживать ее в новом каталоге. Если вы хотите сделать это самостоятельно, вы можете установить apache или nginx на свой компьютер и обслуживать свою папку dist (она не будет общедоступной, но вы можете иметь представление о том, как она работает. Установка локального экземпляра nginx или apache должен делать работу. - person Danizavtz; 09.01.2021

arrow_upward
0
arrow_downward

просто

npm запустить сборку

Скопируйте папку index.html и / dist / в корневой каталог вашего сайта. Выполнено.

person Md Mahamudul Hasan    schedule 09.01.2021

arrow_upward
0
arrow_downward

  1. Команда npm run build подходит для подготовки проекта к развертыванию.

  2. Вам не нужно запускать команду npm run serve, как на локальном компьютере.

Для развертывания после выполнения команды npm run build вам понадобятся:

Папка dist и файл index.html.

Вы можете развернуть свой проект у любого хостинг-провайдера по вашему выбору.

Я буду использовать aws s3 в качестве примера для статического приложения (процесс почти такой же на других платформах).

  1. Войти в aws

  2. Выберите s3

  3. Создайте новую корзину (дайте ей желаемое имя и выберите регион)

  4. Включите параметр Статический хостинг веб-сайтов в только что созданном сегменте. В полях для Индексного документа и Документа об ошибке должно быть установлено значение index.html.

  5. Установить разрешение сегмента (добавить политику сегмента)

Вставьте это в редактор политики корзины и сохраните. Измените your-bucketName на созданное имя корзины.

{
    "Version": "2012-10-17",
    "Statement": [
        {
            "Sid": "PublicReadGetObject",
            "Effect": "Allow",
            "Principal": "*",
            "Action": [
                "s3:GetObject"
            ],
            "Resource": [
                "arn:aws:s3:::your-bucketName/*"
            ]
        }
    ]
}

  1. Загрузите файлы (build.js в папку dist и index.js).

    1. Click on your bucket name
    2. Выберите загрузку в верхнем меню
    3. Загрузите файлы, указанные выше

  2. Создайте в корзине папку с именем dist и переместите внутрь build.js.

  3. Нажмите Все сегменты, чтобы вернуться. Выберите Свойства развернутой корзины в правом верхнем меню и нажмите Конечная точка, чтобы запустить размещенный сайт.

person Gblend    schedule 09.01.2021