将自定义 Modernizr 构建集成到 Angular 项目中的最佳方法是什么？

Question

我想将自定义 Modernizr 构建集成到我的 Angular 项目中以进行功能检测。我找到了这个 Webpack Modernizr loader on GitHub，但我不知道如何将它集成到我的项目中。

我将以下代码放入项目根目录中的 .modernizrrc 文件中，但实际上我该如何调用它？

{
  "minify": true,
  "options": [
    "setClasses"
  ],
  "feature-detects": [
    "test/css/vwunit"
  ]
}

README文件中有这段代码，但我不知道放在哪里。

const path = require('path');

module.exports = {
  module: {
    rules: [
      {
        test: /\.modernizrrc.js$/,
        use: [ 'modernizr-loader' ]
      },
      {
        test: /\.modernizrrc(\.json)?$/,
        use: [ 'modernizr-loader', 'json-loader' ]
      }
    ]
  },
  resolve: {
    alias: {
      modernizr$: path.resolve(__dirname, "path/to/.modernizrrc")
    }
  }
}

Answer 1

我找到了这个问题的解决方案。您可以使用 ngx-build-plus.

包含部分 webpack 配置

const webpack = require('webpack');

module.exports = {
  module: {
    rules: [
      {
        test: /\.modernizrrc.js$/,
        use: [ 'modernizr-loader' ]
      },
      {
        test: /\.modernizrrc(\.json)?$/,
        use: [ 'modernizr-loader', 'json-loader' ]
      }
    ]
  },
  resolve: {
    alias: {
      modernizr$: path.resolve(__dirname, "path/to/.modernizrrc")
    }
  }
}

将自定义 Modernizr 构建集成到 Angular 项目中的最佳方法是什么？

What is the best way to integrate custom Modernizr build into an Angular project?

modernizr

webpack

angular