Skip to content
This repository was archived by the owner on May 5, 2025. It is now read-only.

Latest commit

 

History

History
79 lines (66 loc) · 2.53 KB

File metadata and controls

79 lines (66 loc) · 2.53 KB

更友好的错误提示

@cloudbase/js-sdk在开发环境下会将调用 API 的错误信息以更友好的方式打印到控制台,如下图所示:

图中打印的错误是当前的登录类型受到函数的安全规则限制,导致没有调用函数的权限。错误信息分为两部分:

  1. 上半部分的黑色字体提示包含了后端 API 返回的错误信息以及基于此报错的一些解决方案提示;
  2. 下半部分的红色字体是经优化后的错误堆栈,由于原始错误堆栈层次太深导致debug非常困难,所以此处打印的错误堆栈的第一条直接定位到 SDK 源码,第二条定位到调用报错 API 的业务源码。

使用方式

优化的错误提示仅在开发环境中使用,根据process.env.NODE_ENV判断是否为开发环境。此外,定位到 SDK 源码需要借助sourcemap。

以上两点依赖构建工具的部分特性,目前仅支持 Webpack 和 Rollup。

Webpack

在 Webpack 4+ 版本中可以配置mode选项为development,如下:

module.exports = {
  mode: 'development'
}

如果是旧版本的 Webpack 需要使用DefinePlugin

const webpack = require('webpack')

module.exports = {
  plugins: [
    new webpack.DefinePlugin({
      'process.env.NODE_ENV': JSON.stringify('development')
    })
    // ...其他插件
  ]
  // ...其他配置
}

然后为js的编译选项加入sourcemap预处理,这里需要使用source-map-loader

module.exports = {
  module: {
    rules: [
      {
        test: /\.js$/,
        enforce: 'pre',
        use: ['source-map-loader']
      }
      // ...其他rules
    ]
  }
  // ...其他配置
}

配置完成后启动webpack-dev-server即可。

Rollup

Rollup需要使用两个插件:

配置如下:

import sourcemaps from 'rollup-plugin-sourcemaps';
import replace from 'rollup-plugin-replace';
export default {
  plugins: [
    sourcemaps(),
    replace({
      'process.env.NODE_ENV': JSON.stringify('development')
    })
    // ...其他插件
  ]
  // ...其他配置
};

配置完成使用rollup-plugin-serve启动dev server即可。