Как развернуть мое веб-приложение, созданное с помощью ParcelJS, на моем сервере Ubuntu 18.10?

У меня есть веб-страница HTML, которая использует некоторые CSS и TypeScript. Я использовал сервер разработки ParcelJS для создания и тестирования своей страницы.

Теперь я хочу обслуживать свое приложение через веб-сервер. У меня есть дроплет / виртуальная машина Ubuntu 18.10 DigitalOcean, на которой настроен nginx.

Я клонировал свой код на свой сервер, установил ParcelJS и запустил parcel build index.html следующие инструкции здесь.

Затем я попытался развернуть мою веб-страницу, создав символическую ссылку из /var/www/mysitedomain/html/app.html в ~/myappdir/dist/index.html,

Это (отчасти) работает: когда я захожу на свой веб-сайт, мой браузер загружает мой index.html.

Тем не менее, ни один из моих CSS не выполняет рендеринг, и мои скрипты также, похоже, не работают!

Понятно, что я делаю что-то не так. Что я должен делать вместо этого, чтобы развернуть мое приложение?

Вот мой сокращенный index.html (после запуска parcel build index.html):

<!DOCTYPE html>
<head>
  <title>Nothing to see here!</title>
  <link rel="stylesheet" href="/sidebar.04cc1813.css">
</head>
<body>
  <aside class="sidenav">
    <h1>A sidebar</h1>
  </aside>

  <section class="main">
    <p>Welcome to the semantic web!</p>
  </section>
  <script src="/main.9b45144c.js"></script>
</body>

Вот мой /etc/nginx/sites-enabled/mysite.com:

server {
        listen 80;
        listen [::]:80;

        root /var/www/mysite.com/html;
        index index.html index.htm index.nginx-debian.html app.html;

        server_name mysite.com www.mysite.com;

        location / {
                try_files $uri $uri/ =404;
        }  
}

1 ответ

Решение

Добавление --public-url ./ CLI arg вашей команды parcel скажет parcel отправлять ссылки на URL ресурсов относительно заданного базового URL. Т.е. ваши существующие:

<script src="/main.9b45144c.js"></script>

превратится в:

<script src="./main.9b45144c.js"></script>

То же самое с CSS и другими активами...

Также см.: https://parceljs.org/cli.html.

Другие вопросы по тегам