Webpack (VueJS) создает разные пути к изображениям для FIrefox и Chrome - PullRequest
0 голосов
/ 24 сентября 2018

У меня VueJS OnePageApplication на основе ASP.NET MVC.Просмотр реализован как .cshtml страница без содержимого с подключенным скриптом VueJS.Приложение, размещенное в IIS, на localhost/ksodd.

Структура файла IIS:

wwwroot/ksodd/
- bin
- View/
- Scripts/
-- dist/
--- images/
---- search.png
--- build.js

В файле webpack.config.js у меня есть:

module.exports = {
  ...
  output: {
    path: path.resolve(__dirname, './dist'),
    publicPath: '',
  ...

  module: {
    rules: [
    ...
      {
        test: /\.(png|jpg|gif|svg)$/,
        loader: 'file-loader',
        options: {
          name: 'images/[name].[ext]',
          publicPath: './Scripts/dist'
        }
      }
    ...
    ]
  }

В компоненте vue:

<template>
...
  <img src="../assets/images/search.png">
...
</template>

Когда приложение работает на localhost, все работает нормально, но когда я запускаю его в IIS, как localhost/ksodd происходит волшебство:

FirefoxВ Firefox образе src имеют неверный путь от корня сайта: localhost/Scripts/dist/images/search.png.Возвращает 404.

Chrome В хромированном изображении src имеет правильный путь: localhost/ksodd/Scripts/dist/images/search.png.Возвращает 200.

В чем причина этого и как я могу это исправить?Как сделать проект VueJS, который может работать во вложенных URL-адресах, как в корне сайта?

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...