1. 程式人生 > >Angular問題04 模塊導入錯誤???、BrowserModule模塊重復加載???

Angular問題04 模塊導入錯誤???、BrowserModule模塊重復加載???

port .com log 重復加載 mon 一次 項目 col ant

1 模塊導入錯誤

  1.1 問題描述

    項目啟動時報錯:元數據錯誤,錯誤截圖如下:

      技術分享圖片

  1.2 問題原因

    利用VsCode開發angular項目時利用自動導入出現錯誤

    坑01:VsCode 的自動導入功能比較智能,它會進行精確導入;例如:NgModule 在利用VsCode進行自動導入的結果如下:

import { NgModule } from "@angular/core/src/metadata/ng_module";

      但是由於腳手架的原因這樣導入會報錯:在 @angular/core/src/metadata/ng_module 目錄下導入 NgModule 失敗,所以就會出現元數據錯誤

    技巧01:將導入目錄的覆蓋範圍變大,例如:導入NgModule時直接從core目錄導入

import { NgModule } from "@angular/core";

  1.3 問題解決

    將導入目錄的覆蓋範圍增大即可

  1.4 常用模塊所在目錄整理

    待更新...

2 BrowserModule 模塊重復加載

  2.1 問題描述

    angular項目使用了模塊懶加載並且將一些公用模塊放到了一個共享模塊中進行處理;啟動項目後報錯:BrowserModule不能重復加載,log截圖如下

      技術分享圖片

  2.2 問題原因

    BrowserModule模塊和CommonModule模塊都包含了angular項目需要用到的一些節本指令;但是,CommonModule支持多次導入,BrowserModule只能導入一次

  2.2 問題解決

    將BrowserModule模塊中共享模塊中移除,直接在跟模塊中進行導入即可

  2.3 常用模塊導入整理

    2.3.1 支持多次導入

      CommonModule、NgZorroAntdModule

    2.3.2 只能導入一次

      CommonModule

Angular問題04 模塊導入錯誤???、BrowserModule模塊重復加載???