如何标记/切换TypeScript服务/类

plupiseo 于 2023-05-19 发布在 TypeScript

关注(0)|答案(2)|浏览(114)

我想在我的React应用程序中添加一个服务标志，这样我就可以通过在配置文件中更改布尔值来打开和关闭它。然而，我不确定如何最好地做到这一点。服务如下：

class Service {
  constructor() {
    // do stuff
  }

  doA() {
    // do stuff
  }

  doB() {
    // do stuff
  }

  // more methods
}

export const serviceInstance = new Service();

此服务的方法在应用程序的不同部分被调用。
目前，我通过创建另一个具有与Service相同的方法和属性的类来标记它，然后根据特征标志布尔值导出相关示例：

class ServiceMock {
  constructor() {
    return;
  }

  doA() {
    return;
  }

  doB() {
    return;
  }

  // more empty return methods
}

export const serviceInstance = serviceFlag ? new Service() : new ServiceMock();

它可以工作，但我担心这是相当低效的，特别是当方法和属性的数量增加时。有没有更好的方法来实现这样的功能？

typescript

来源：https://stackoverflow.com/questions/72776261/how-to-feature-flag-toggle-typescript-service-class

2条答案

按热度按时间

8xiog9wr1#

我是TypeScript的新手，但这有帮助吗？

interface IService {
    doA(): void
    doB(): void
}

class Service implements IService {
    doA(): void {
        console.log("doA");
    }
    doB(): void {
        console.log("doB");
    }
}

class ServiceMock implements IService {
    doA(): void {
        console.log("mockA");
    }
    doB(): void {
        console.log("mockB");
    }
}

function createService(serviceFlag: boolean): IService {
    return (serviceFlag) ? new Service() : new ServiceMock();
}

const originalServiceInstance = createService(true);
const mockServiceInstance = createService(false);
originalServiceInstance.doA();
mockServiceInstance.doA();

如果有人有改进或建议，我仍然在努力从python转向TypeScript，并很乐意改进这个答案。
它在TypeScript Playground上运行时没有错误。

赞(0）回复(0）举报 2023-05-19

eagi6jfj2#

你应该在你的项目中使用webpack。最好的方法是只构建你需要的代码。但是在你的演示代码export const serviceInstance = serviceFlag ? new Service() : new ServiceMock();中，它会将这两个服务构建到你的运行时代码中。
如果你在webpack中做了这个配置，会有帮助。

module.exports = {
  //...
  plugins: [
    new webpack.DefinePlugin({
      'process.env.serviceFlag': JSON.stringify(process.env.serviceFlag),
    }),
  ],
};

然后在代码中使用环境变量，如export const serviceInstance = process.env.serviceFlag === "true" ? new Service() : new ServiceMock();。最后，不要忘记在npm脚本中传递环境变量。

{
  "scripts": {
    "build": "cross-env serviceFlag=true umi build",
    "build:mock": "cross-env serviceFlag=false umi build",
  },
}

现在可以使用npm run build或npm run build:mock，运行时代码只包含其中一个服务。

赞(0）回复(0）举报 2023-05-19

我来回答

如何标记/切换TypeScript服务/类

2条答案

相关问题

热门标签

最新问答