Горячая перезагрузка webpack-dev-server не работает: какой контент обслуживается? - PullRequest
Новая
       14

Горячая перезагрузка webpack-dev-server не работает: какой контент обслуживается?

0 голосов
/ 02 мая 2019

Этот вопрос является дубликатом Горячая перезагрузка webpack-dev-server не работает . Ответ @fafaro добился цели, но не приемлем для производства.

вот моя файловая структура 

public
  css
    style.css
  index.html
  js
    main.js
src
  index.html
  js
    index.js
node_modules
webpack.config.js
package.json

@ fafaro предлагает сделать следующее изменение в моем ìndex.html. 

<script src="main.js"></script>      // works
<script src="js/main.js"></script> // doesn't work!

Вот мой webpack.config.js: 

const path = require("path");
const webpack = require("webpack");

// SCSS loader for transpiling SCSS files to CSS
const scssLoader = {
  test: /\.(scss|css)$/,
  use: [
    "vue-style-loader",
    {
      loader: "css-loader",
      options: { modules: false }
    },
    "sass-loader"
  ]
};
// URL loader to resolve data-urls at build time
const urlLoader = {
  test: /\.(png|jpg|svg)$/,
  loader: "url-loader?limit=25000"
};
// Vue loader to resolve single file components
const vueLoader = {
  test: /\.vue$/,
  loader: "vue-loader"
};
const VueLoaderPlugin = require("vue-loader/lib/plugin");

const webpackConfig = {
  mode: "development",
  devtool: "source-map",
  output: {
    path: path.join(__dirname, "public/js"),
    filename: "main.js"
  },
  devServer: {
    contentBase: path.join(__dirname, "public/"),
    port: 80,
    open: "Chrome",
    proxy: {
      "/association": {
        target: {
          host: "localhost",
          port: 8080,
          protocol: "http"
        },
        changeOrigin: true,
        logLevel: "debug"
      }
    }
  },
  module: {
    rules: [scssLoader, urlLoader, vueLoader]
  },
  plugins: [
    new VueLoaderPlugin(),
  ]
};
module.exports = webpackConfig;

Проблема в том, что я не хочу менять index.html между разработкой и производственной сборкой.

Мои вопросы: почему webpack-dev-server не использует мой путь сборки вывода и как я могу настроить горячую перезагрузку для своей структуры хранилища, не изменяя ничего между разработкой и производственной сборкой?

Я думал об использовании файла index.html.dev с использованием devServer.index но мне интересно, есть ли лучшее решение?

...