0

我有一个 Ionic 应用程序，它严重依赖条件编译，我根据一组类似于 m4 的工作方式的配置值包含或排除代码块。

为此，我一直在成功使用https://github.com/nippur72/ifdef-loader 。

我现在面临着将此应用程序从 Angular 10 升级到 13（Ionic 5 到 6）。

ifdef-loader 不适用于 Angular 10，但 @angular-dev-kit 的补丁（https://gist.github.com/tristanidoux/892469f2c345bd6c6551eb19c705a016）允许它运行。

此补丁不适用于 Angular 13，因为所有文件都已更改并尽可能多地爬取源代码我还没有看到如何为 Angular 13 创建类似的补丁。

所以我一直在尝试使用https://medium.com/angular-in-depth/customizing-angular-cli-build-an-alternative使用 "@angular-builders/custom-webpack": "^13.0.0" -to-ng-eject-v2-c655768b48cc作为指南。

我有以下以 ifdef-loader 文档为模型的 custom.webpack.config.js 文件：

// ifdef-loader config

const opts = {
   APP: false,
   WEB: true,
   DEBUG: true,
   version: 3,
   "ifdef-verbose": true,                 // add this for verbose output
   "ifdef-triple-slash": true,           // add this to use double slash comment instead of default triple slash
   "ifdef-fill-with-blanks": true,         // add this to remove code with blank spaces instead of "//" comments
   "ifdef-uncomment-prefix": "// #code "  // add this to uncomment code starting with "// #code "
};

module.exports = {
  module: {
    rules: [
      {
        test: /\.tsx?$/,
        exclude: /node_modules/,
        use: [
          { loader: 'ts-loader' },
          { loader: 'ifdef-loader', options: opts }
        ]
      }
    ]
  },

不幸的是，这不起作用，因为 ifdef-loader 似乎没有被调用。

所以三个问题：

  1. 我在我的配置中犯了一些明显的错误吗？

  2. 有没有人让 ifdef-loader 与 Angular 13 一起工作？如果是这样，怎么做？

  3. 或者，是否有其他解决方案可以在 Angular 13 项目中有条件地包含/排除代码块？

任何指针或建议将不胜感激。

4

1 回答 1

0

一周后，我无法确定如何在 Angular 的 webpack 实现中将模块插入到 typescript 编译管道中，所以我选择为 @angular-devkit/build-angular/@ngtools/webpack 创建一个补丁来调用 ifdef-loader直接地。

补丁在这里：Angular Webpack 补丁

这很丑陋，但它有效。

于 2022-01-15T00:06:41.310 回答