zoukankan      html  css  js  c++  java
  • webpack 模块热更新配置

    1、配置webpack不需要安装什么,只需要原先安装的webpack即可配置

    const path = require('path')
    const webpack = require('webpack')
    module.exports = {
      mode: 'production',
      entry: {
        main: './src/main.js'
      },
      devtool: 'cheap-module-source-map',
      devServer: {
        contentBase: path.join(__dirname, "dist"),
        compress: true,
        port: 9000,
        open: true,
        hot: true,    //开启热更新
        hotOnly: true   //开启热更新失败,依然不刷新浏览器
      },
      plugins: [
        new webpack.HotModuleReplacementPlugin()  // 这个插件一定要使用
      ],
      output: {
        path: path.resolve(__dirname, 'dist'),
        filename: '[name].js'
      }
    }
    

    2、css-loader 自动配置了热更新,更改了css,样式自己就改变了,react、vue框架自身也配置了,如果需要自定义,代码如下

    if(module.hot){    //在你要监听的文件里面写
        module.hot.accept('./src',()=>{    // ./src值得是更新文件路径
            console.log('代码热更新,写自己的代码控制')        
        })
    }
    

      

  • 相关阅读:
    py程序----两个判断回文的程序
    Python特性
    python-基本数据类型
    shell编程第一天
    iptables防火墙
    纤维参数测量
    线性代数及其应用(最小二乘、PCA、SVD)
    水流方向检测
    微信跳一跳-MATLAB实现
    相机标定opencv实现
  • 原文地址:https://www.cnblogs.com/uimeigui/p/13923016.html
Copyright © 2011-2022 走看看