webpack中怎么增加mode?或者说怎么其他的环境?我想增加一个mock环境?

2023-05-11 阅读 50

在webpack中,可以通过在配置文件中设置mode属性来指定环境模式,可选项有development、production和none。例如:

module.exports = {
  mode: 'development',
  // 其他配置项
}

如果您想增加一个mock环境,可以考虑使用webpack-dev-server来实现。webpack-dev-server是一个开发服务器,可以在本地启动一个服务器,然后将打包后的文件提供给浏览器访问。同时,它还支持热更新、代理等功能,非常适合开发阶段使用。

您可以在配置文件中添加如下配置:

module.exports = {
  mode: 'development',
  devServer: {
    contentBase: './dist', // 设置服务器根目录
    port: 8080, // 设置端口号
    proxy: { // 设置代理,用于mock数据
      '/api': {
        target: 'http://localhost:3000', // 设置代理目标地址
        pathRewrite: {'^/api' : ''}, // 将请求地址中的/api替换为空
        changeOrigin: true // 设置跨域
      }
    }
  },
  // 其他配置项
}

上面的配置中,我们设置了一个代理,将所有以/api开头的请求都转发到http://localhost:3000上,这样就可以在本地模拟后端接口返回数据了。同时,我们还设置了服务器根目录和端口号。您可以根据自己的需求进行修改。

更新于 2023年05月12日