Разработка на Angular2 с TS, но без NPM

Ответ 1

Фактически эти файлы представляют собой пакетную версию Angular2 и ее зависимостей. Они могут использоваться в приложении, написанном с помощью TypeScript. По сути, TypeScript нельзя использовать из коробки в браузерах. Вы должны предварительно обработать их, чтобы скомпилировать их в ES-код с помощью компилятора TypeScript или перевести их в браузере непосредственно с помощью библиотеки TypeScript.

Это можно настроить в SystemJS непосредственно через его атрибут конфигурации transpiler (см. ниже).

Сначала просто добавьте эти файлы в свой HTML файл:

<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>

Если вы хотите реализовать приложение без NPM, вы можете передать ваши файлы TypeScript в браузере. Это мы делаем при использовании plunkr. Для этого вам необходимо настроить SystemJS, как описано ниже:

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

Будьте осторожны, чтобы определить ваши файлы TypeScript в папке app

Вот простой (и полный) plunkr, описывающий, как это сделать: https://plnkr.co/edit/vYQPePG4KDoktPoGaxYu?p=info.

Вы можете загрузить соответствующий код и локально использовать его код со статическим HTTP-сервером, например http-server без использования NPM. Это может быть хорошей отправной точкой для вашего использования...

Edit

Если ваши файлы TypeScript скомпилированы VS, вам необходимо адаптировать конфигурацию SystemJS, как описано ниже:

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

Таким образом SystemJS будет загружать ваши JS файлы при импорте. Например: System.import('app/boot') будет использовать app/boot.js, а не TypeScript one