2017-08-30 228 views
4

按照Typescript documentation (section "Guidance for structuring modules")爲什麼在Angular中不推薦使用「導出默認」?

如果你只導出一個類或函數,使用出口 默認

正如「靠近頂層出口」減少你的 摩擦模塊的消費者,所以引入了默認導出。如果一個 模塊的主要目的是容納一個特定的導出,那麼你應該考慮將其導出爲默認導出。這使得兩個 導入和實際使用導入更容易一些。

實施例:

export default class SomeType { 
    constructor() { ... } 
} 

Angular documentation for components(例如)人看到這一點:

export class HeroListComponent implements OnInit { 
    heroes: Hero[]; 
    selectedHero: Hero; 

    constructor(private service: HeroService) { } 

    ngOnInit() { 
    this.heroes = this.service.getHeroes(); 
    } 

    selectHero(hero: Hero) { this.selectedHero = hero; } 
} 

一般而言,組件或模塊的主要目的是容納一個特定出口。那麼,Angular不使用或推薦使用export default有什麼原因嗎?

+0

可能是人們使用繞單個語句括號同樣的道理在的if/else分支 - 的一致性,並最大限度地減少變化在需要添加第二條語句或導出時添加到代碼中。一致性實際上使得導入更容易 - 我不需要檢查一個模塊是否有默認導出,或者每次我需要導入某些東西時都沒有。 – artem

+2

請勿將TypeScript語言問題與此問題混淆。我讀過一些地方,組件的默認導出會破壞Angular中的提前編譯器。爲什麼發生這種情況我不知道,但有時候你應該按照文檔。我們可以使用Angular團隊的權威人士的回答來澄清這個問題,這就是爲什麼我要求它不被關閉的原因。這是一個非常好的問題,我不喜歡人們把它作爲製表符或空格問題寫下來。 – cgTag

回答

5

實際的原因是,這不適用於AOT編譯器,但它將與JIT編譯器一起工作。因此,如果您使用AOT(或想要使用它向前移動),請不要執行導出默認設置。 也here參見:

默認出口

默認出口不準與AOT - 它們必須被命名。

❌DONT:

import { Component } from '@angular/core'; 

@Component({ 
    template: ` 
    <div class="example"> 
     Example component! 
    </div> 
    ` 
}) 
export default class ExampleComponent { 

} 

✅DO:

import { Component } from '@angular/core'; 

@Component({ 
    template: ` 
    <div class="example"> 
     Example component! 
    </div> 
    ` 
}) 
export class ExampleComponent { 

} 
+1

其他**不要**也很有趣。在任何人想知道的情況下,「私人財產」下的最後一行應該是「在他們上面使用@internal註釋或者使他們成爲** public **。」 –

相關問題