Webpack не загружает скрипты, когда приложение работает в виртуальной папке - PullRequest
0 голосов
/ 18 сентября 2018

У меня есть приложение веб-пакета, которое объединяет угловой код в одну папку:

|
|-index.html
|-polyfills.js
|-vendor.js
|-app.js

Запуск приложения с использованием webpack-dev-server работает.Это также верно, если я разверну его в своем локальном IIS и вызову через http://localhost.Проблема возникает, когда это приложение помещается в папку под корнем IIS.Поэтому, если приложение вызывается с http://localhost/myApp/, оно возвращает 404 для всех активов.(GET http://localhost/polyfills.js 404 (Not Found))

Сначала я проверил сгенерированный вывод html в index.html:

<script type="text/javascript" src="polyfills.js"></script>
<script type="text/javascript" src="vendor.js"></script>
<script type="text/javascript" src="app.js"></script>

Поскольку HTML и скрипты находятся на одном и том же относительном пути, это должно быть правильно.

После этого я изменил output.publicPath на "/", так что теперь конфигурация и мой сгенерированный HTML-код выглядели так:

output: {
        path: helpers.root('./dist'),
        filename: '[name].js',
        chunkFilename: '[id].chunk.js',
        publicPath: "/"
    },

<script type="text/javascript" src="/polyfills.js"></script>

Это ничего не изменило.

У меня нет контроля над тем, где развертывается это небольшое приложение и как оно вызывается, поэтому мне нужно убедиться, что все файлы загружаются правильно, независимо от того, находятся ли они физически в корневой папке или подпапке веб-приложений.Что мне нужно изменить в моем webpack.config.js, чтобы добиться этого?

Редактировать Как и просили в комментариях, вот сгенерированный index.html:

<!DOCTYPE html>
<html>

    <head>

        <base href="/">
        <meta charset="UTF-8">
        <meta http-equiv="X-UA-Compatible" content="IE=edge" />
        <meta name="viewport" content="width=device-width, initial-scale=1">
    </head>

    <body>
        <div class="container-fluid fill">
            <div class="row ml-0 mr-0 fill">
                <div class="col pl-0 pr-0">
                    <my-app>The application is starting up...</my-app>
                </div>
            </div>

        </div>
    <script type="text/javascript" src="polyfills.js"></script><script type="text/javascript" src="vendor.js"></script><script type="text/javascript" src="app.js"></script>
    </body>
</html>
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...