如何防止 Grunt dom_munger 剥离您的 CDN 依赖项？

Question

我有一个对象 Plaid，它是由 Plaid, called Plaid Link 的一个插件模块提供的。在本地，代码在我的 AngularJS 前端完美运行。

模块通过我的 AngularJS 应用程序的 index.html 文件加载，就在为我的应用程序加载的所有其他脚本标签旁边。

Index.html

<script src="https://cdn.plaid.com/link/stable/link-initialize.js"></script>

这是调用 Plaid 的代码： （来自 AngularJS 控制器）

$scope.addAccount = function(bankChosen) {

    $log.debug("Plaid object: ", Plaid);
    var linkHandler = Plaid.create({ // the troublesome line 
        env: 'tartan',
        clientName: 'Example Project',
        key: 'test_key',
        product: 'connect',
        onSuccess: function(public_token) {
            Restangular.one('plaid').customPOST(
                {
                    public_token: public_token,
                    user_id: $scope.currentUser.id,
                    institution_code: bankChosen
                },
                'addAccount'
            );
        },
        onExit: function() {
            $state.go('dashboard.successState');
        },
    });

    linkHandler.open(bankChosen);

};

但是，当我推送到当前托管在 Heroku 上的生产环境时，它会在尝试加载时给出 javascript 错误 ReferenceError: Plaid is not defined。部署到生产时出现中断错误。

什么可能导致此模块在生产期间不可用？

加载 CDN 的脚本可能会被执行此类操作的标准 grunt 任务剥离？或者也许我应该在生产环境设置中以其他方式从 CDN 加载模块？我真的不知道...

更新：我发现一件事可能会剥离加载的模块

来自Grunt dom-munger docs

Use this task to read and transform your HTML documents. Typical use cases include:

Read the references from your script or link tags and pass those to concat,uglify, etc automatically.

2. Update HTML to remove script references or anything that is not intended for your production builds.

Add, update, or remove any DOM elements for any reason.

dom_munger 是我的应用程序构建过程的一部分，它在部署时发生 (!)。 Grunt 可能是这里的罪魁祸首。

有人知道如何加载上面的脚本标签吗？dom_munger 仍然是我应用程序的 grunt 构建步骤的一部分？

Answer 1

问题是在构建步骤中，Grunt 去除了我的应用程序中的脚本标签。所以我不得不使用 dom_munger 的更新 --> 选项 --> 追加选项将标签 append 放回我的 body 标签。

...只有这样，我才能在使用 grunt build 构建应用程序后正确链接到 CDN 脚本。

该行在我的 Gruntfile 中看起来像这样。

--> The key added line is this one
{selector:'body',html:'<script src="https://cdn.plaid.com/link/stable/link-initialize.js"></script>'},


dom_munger:{
    [.....]
  update: {
    options: {
      append: [
        {selector:'body',html:'<script src="https://cdn.plaid.com/link/stable/link-initialize.js"></script>'},
      ]
    },
    src:'index.html',
    dest: 'dist/index.html'
  }

对我来说真是个神秘的错误。我希望这在某些时候对其他人有所帮助body！

如何防止 Grunt dom_munger 剥离您的 CDN 依赖项？

How to keep Grunt dom_munger from stripping your CDN dependencies?

angularjs

heroku

gruntjs

plaid