1. vue-cli(脚手架)引入vue.config.js文件后热更新失效,每次保存都会刷新页面

问题起因
当我为项目引入vue.config.js文件后发现热替换就失灵了,每次保存都会刷新页面,我就感到纳闷,为什么不引入配置文件的时候就是好好的,所以问题明显是在配置文件上.
问题所在
当前的配置文件
module.exports = {
    publicPath: '/',
    outputDir: 'dist',
    assetsDir: 'assets',
    configureWebpack: {
        devServer: {
            contentBase: './src',//项目基本访问目录
            host: 'localhost',//服务器ip地址
            port: 8088,//端口
            hot: true,//模块热替换
            hotOnly: true,//只有热更新不会刷新页面
        }
    },
    css: {
        // 是否使用css分离插件 ExtractTextPlugin
        //  extract: true,
        // 开启 CSS source maps?
        sourceMap: true,
        // 启用 CSS modules for all css / pre-processor files.
        modules: false
    }
}
经过与原来的项目进行对比,问题出在contentBase: './src',上
解决方法
将contentBase的目录指向当前目录即可
更改后的配置文件
module.exports = {
  publicPath: '/',
  outputDir: 'dist',
  assetsDir: 'assets',
  configureWebpack: {
      devServer: {
          contentBase: './',//项目基本访问目录
          host: 'localhost',//服务器ip地址
          port: 8088,//端口
          hot: true,//模块热替换
          hotOnly: true,//只有热更新不会刷新页面
      }
  },
  css: {
      // 是否使用css分离插件 ExtractTextPlugin
      //  extract: true,
      // 开启 CSS source maps?
      sourceMap: true,
      // 启用 CSS modules for all css / pre-processor files.
      modules: false
  }
}

vue-cli

uni-app

Last modified 3yr ago