javascript - Utvikling på Angular2 med TS, men uten NPM

Alle guider foreslår å installere npm, men jeg leter etter en måte uten det.

Det finnes Angular2-filer tilgjengelig, men ingen av dem er TypeScript-kode.

Så hva må jeg gjøre? Trenger jeg Angular2.ts eller spesifikke Angular2-xx.js og .d.ts-filer?

OPPDATERING: Jeg har lastet ned Angular2 gjennom NPM og fått hele kildekoden, hvor det er vanskelig å finne spesifikke ting. Å søke etter .d.ts for Angular2 ga ingen resultater. Mange .ts og .d.ts-filer finnes i den enorme samlingen av kode.

Svar #1

Faktisk er disse filene en samlet versjon av Angular2 og dens avhengigheter. De kan brukes innenfor en applikasjon skrevet med TypeScript. Faktisk kan ikke TypeScript brukes direkte i nettlesere. Du må forhåndsbehandle dem for å kompilere dem til ES-kode med TypeScript-kompilatoren, eller transpilere dem direkte i nettleseren med TypeScript-biblioteket.

Dette kan konfigureres direkte i SystemJS gjennom dets transpiler-konfigurasjonsattributt (se nedenfor).

Først legger du ganske enkelt til disse filene i HTML-filen din:

<script src="https://code.angularjs.org/2.0.0-beta.2/angular2-polyfills.js"></script>
<script src="https://code.angularjs.org/tools/system.js"></script>
<script src="https://code.angularjs.org/tools/typescript.js"></script>
<script src="https://code.angularjs.org/2.0.0-beta.2/Rx.js"></script>
<script src="https://code.angularjs.org/2.0.0-beta.2/angular2.dev.js"></script>
<script src="https://code.angularjs.org/2.0.0-beta.2/http.dev.js"></script>

Hvis du vil implementere en applikasjon uten NPM, kan du transpile dine TypeScript-filer i nettleseren. Det er slik vi gjør når vi bruker plunkr. For dette trenger du å konfigurere SystemJS som beskrevet nedenfor:

<script>
  System.config({
    transpiler: 'typescript', 
    typescriptOptions: {
      emitDecoratorMetadata: true
    },
    packages: {
      'app': {
        defaultExtension: 'ts'
      }
    } 
  });
  System.import('app/main')
        .then(null, console.error.bind(console));
</script>

Vær nøye med å definere dine TypeScript-filer under en app-mappe

Her er en enkel (og komplett) plunkr som beskriver hvordan man gjør det: https://plnkr.co/edit/vYQPePG4KDoktPoGaxYu?p=info.

Du kan laste ned den tilsvarende koden og bruke koden lokalt med en statisk HTTP-server som http-server uten å bruke NPM. Dette kan være et godt utgangspunkt for ditt brukstilfelle...

Rediger

Hvis TypeScript-filene dine kompileres av VS, må du tilpasse SystemJS-konfigurasjonen, som beskrevet nedenfor:

<script>
  System.config({
    packages: {
      app: {
        defaultExtension: 'js',
      }
    }
  });
  System.import('app/boot')
        .then(null, console.error.bind(console));
</script>

På denne måten vil SystemJS laste inn JS-filene dine når du gjør et import. For eksempel: System.import('app/boot') vil bruke app/boot.js og ikke TypeScript-filen

Relaterte artikler