У меня есть приложение веб-пакета, которое объединяет угловой код в одну папку:
|
|-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>