微信公众号搜"智元新知"关注
微信扫一扫可直接关注哦!

没有自动重新加载页面,webpack-dev-server

如何解决没有自动重新加载页面,webpack-dev-server

一切正常,修改文件后webpack-dev-server编译,但浏览器文件夹没有自动重新加载 安装的软件包: "webpack": "^5.21.2","webpack-cli": "^4.5.0","webpack-dev-server": "^3.11.2"

谢谢

webpack.config.js 中的代码


const path = require('path')
const {CleanWebpackPlugin} = require('clean-webpack-plugin')
const HTMLWebpackPlugin = require('html-webpack-plugin')
const copyPlugin = require('copy-webpack-plugin')
const MiniCssExtractPlugin = require('mini-css-extract-plugin')


const isProd = process.env.NODE_ENV === 'production'
const isDev = !isProd

console.log(isDev)

const filename = ext => isDev ? `bundle.${ext}` : `bundle.[hash].${ext}`

const jsLoaders = () => {
    const loaders = [
        {
            loader: 'babel-loader',options: {
                presets: ['@babel/preset-env']
            }
        }
    ]

    if (isDev) {
        loaders.push('eslint-loader')
    }

    return loaders
}

module.exports = {
    context: path.resolve(__dirname,'src'),mode: 'development',entry: ['@babel/polyfill','./index.js'],output: {
        filename: filename('js'),path: path.resolve(__dirname,'dist')
    },resolve: {
        extensions: ['.js'],alias: {
            '@': path.resolve(__dirname,'@core': path.resolve(__dirname,'src/core')
        }
    },devtool: isDev ? 'source-map' : false,devServer: {
        port: 3000,hot: isDev,},***
    }
}


要启动的 NPM 脚本(y 使用 'start' 脚本)


"scripts": {
    "test": "echo \"Error: no test specified\" && exit 1","start": "cross-env NODE_ENV=development webpack serve --hot --inline --open","build": "cross-env NODE_ENV=production webpack --mode production"
  },

解决方法

尝试升级到测试版 webpack-dev-server (v4)

版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。