Angular: Impor salah yang ditulis oleh penyedia yang dapat digoyahkan di bawah Bazel

Penyedia yang dapat digoyahkan pohon memicu kompiler Angular untuk memperkenalkan pernyataan impor dalam kode pengguna, yang tidak kami lakukan sebelumnya. Ternyata kami memiliki tempat di mana kami menggabungkan jalur modul pada disk dengan nama modul (versi kompiler sebelumnya tidak memiliki perbedaan ini)
Jadi kita akhirnya menulis impor seperti import {} from 'wksp/packages/path/to/thing' yang seharusnya import {} from '@pkg_name/path/to/thing'

Sejauh yang kami tahu, masalah ini hanya memengaruhi pengguna Bazel yang mengompilasi dengan ngc dan menggunakan penyedia yang dapat digoyahkan. Sejauh ini kami hanya melihat masalah ini secara internal di Angular.

Ini ditemukan sebagai bagian dari #20030

Untuk repro, tambahkan penyedia yang dapat digoyahkan, mis. tempel ke 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 {}

kemudian buat paket npm

bazel build //packages/common:npm_package

Dan cari string angular/packages di output:

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

kami menghapus file ngsummary karena ini selalu memiliki jalur pada disk sebagai pengidentifikasi modul.
File ngfactory tidak dikirimkan dengan paket jadi ini mungkin juga tidak berbahaya.

Menariknya, kami menemukan impor yang buruk di keluaran 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";  // <-------------------------

tapi tidak di keluaran 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");