Angular: عمليات الاستيراد الخاطئة المكتوبة بواسطة مزودي خدمات قابلة للاهتزاز ضمن Bazel

يقوم موفرو Tree-shakable بتشغيل المحول البرمجي Angular لتقديم عبارات الاستيراد في كود المستخدم ، وهو ما لم نفعله من قبل. اتضح أن لدينا أماكن ندمج فيها مسارات الوحدة على القرص مع أسماء الوحدات (الإصدارات السابقة من المترجم لم يكن لديها هذا التمييز)
لذلك انتهى بنا الأمر بكتابة واردات مثل import {} from 'wksp/packages/path/to/thing' الذي كان يجب أن يكون import {} from '@pkg_name/path/to/thing'

على حد علمنا ، لا تؤثر هذه المشكلة إلا على مستخدمي Bazel الذين يتعاملون مع ngc ويستخدمون موفري خدمة قابلة للاهتزاز. حتى الآن ، رأينا هذه المشكلة داخليًا فقط في Angular.

تم العثور على هذا كجزء من # 20030

للنسخ ، أضف موفر شجرة قابل للاهتزاز ، مثل الصق في packages/common/src/common_module.ts

import {Injectable, PLATFORM_ID} from '@angular/core';
import {DOCUMENT, isPlatformBrowser} from '@angular/common';

export function viewportScrollerFactory(platformId: string, document: any) {
  return isPlatformBrowser(platformId) ? null: null;
}

@Injectable(
    {providedIn: 'root', useFactory: viewportScrollerFactory, deps: [PLATFORM_ID, DOCUMENT]})
export abstract class ViewportScroller {}

ثم قم ببناء حزمة npm

bazel build //packages/common:npm_package

وابحث عن السلسلة angular/packages في المخرج:

$ export bin=$(bazel info bazel-bin)
$ find $bin -type f -exec fgrep -l angular/packages {} \; | grep -v ngsummary | grep -v ngfactory

نقوم بإزالة ملفات ngsummary لأنها تحتوي دائمًا على مسارات على القرص كمعرفات للوحدات النمطية.
لا يتم شحن ملفات ngfactory مع الحزمة ، لذا من المحتمل أن تكون هذه الملفات غير ضارة أيضًا.

ومن المثير للاهتمام أننا وجدنا الاستيراد السيئ في إخراج ES2015:

bin/packages/common/src/common_module.closure.js

/**
 * <strong i="28">@fileoverview</strong> added by tsickle
 * <strong i="29">@suppress</strong> {checkTypes} checked by tsc
 */
/**
 * <strong i="30">@license</strong>
 * Copyright Google Inc. All Rights Reserved.
 *
 * Use of this source code is governed by an MIT-style license that can be
 * found in the LICENSE file at https://angular.io/license
 */
import { NgModule } from '@angular/core';
import { COMMON_DIRECTIVES } from './directives/index';
import { DEPRECATED_PLURAL_FN, NgLocaleLocalization, NgLocalization, getPluralCase } from './i18n/localization';
import { COMMON_DEPRECATED_I18N_PIPES } from './pipes/deprecated/index';
import { COMMON_PIPES } from './pipes/index';
import { Injectable, PLATFORM_ID } from '@angular/core';
import { DOCUMENT, isPlatformBrowser } from '@angular/common';
import * as i0 from "@angular/core";
import * as i1 from "@angular/core/src/application_tokens";
import * as i2 from "angular/packages/common/src/dom_tokens";  // <-------------------------

ولكن ليس في إخراج ES5

bin/packages/common/src/common_module.js

(function (factory) {
    if (typeof module === "object" && typeof module.exports === "object") {
        var v = factory(require, exports);
        if (v !== undefined) module.exports = v;
    }
    else if (typeof define === "function" && define.amd) {
        define("@angular/common/src/common_module", ["require", "exports", "tslib", "@angular/core", "@angular/common/src/directives/index", "@angular/common/src/i18n/localization", "@angular/common/src/pipes/deprecated/index", "@angular/common/src/pipes/index", "@angular/core", "@angular/common", "@angular/core", "@angular/core/src/application_tokens", "@angular/common/src/dom_tokens"], factory);
    }
})(function (require, exports) {
    "use strict";
    Object.defineProperty(exports, "__esModule", { value: true });
    var tslib_1 = require("tslib");
    var core_1 = require("@angular/core");
    var index_1 = require("@angular/common/src/directives/index");
    var localization_1 = require("@angular/common/src/i18n/localization");
    var index_2 = require("@angular/common/src/pipes/deprecated/index");
    var index_3 = require("@angular/common/src/pipes/index");
    var core_2 = require("@angular/core");
    var common_1 = require("@angular/common");
    var i0 = require("@angular/core");
    var i1 = require("@angular/core/src/application_tokens");
    var i2 = require("@angular/common/src/dom_tokens");