Добавить реакцию на машинописный проект

Question

Я сейчас пытаюсь добавитьactJS в свой проект веб-приложения, но столкнулся с некоторыми трудностями.

Прежде всего, что вы должны сейчас:

• Я использую TypeScript (v2.9) для разработки этого проекта, и все мои файлы используют внутренние модули, поэтому я не могу использовать import * as React from 'react', поскольку он сломает все мои внутренние модули ... Чтобы добавить новые внешние модули, я использую файлы .d.ts и добавляю <script> balise, содержащий скрипт, который я хочу использовать.

• Я использую Grunt в качестве менеджера задач и grunt-ts для компиляции моих машинописных файлов.

Вот структура проекта:

Project
|
+-- Gruntfile.js
|   
+-- package.json
|    
+-- node_modules
|    
+-- public
|  |  
|  +-- webapp
|     |
|     +-- scripts 
|

Скрипты папки содержат все мои наборы текста и библиотеки, которые я импортировал или загрузил (например, jQuery), и эти библиотеки работают отлично.

Что я пробовал до сих пор:

1. Я добавил новый package.json в свою папку сценариев, чтобы я мог хранить все свои наборы в одном месте (тот, который я сделал сам, и тот, который доступен через npm). Я также добавил модуль реакции через npm. На данный момент все хорошо, мое ворчание продолжается без ошибок. Но когда я загружаю свою страницу, у меня появляется ошибка, что require is not defined.

После некоторых исследований я обнаружил, что мне нужно просмотреть файлы моих node_modules, чтобы я мог использовать их в своем браузере. Я использовал grunt-browserify с этим конфигом:

build: {
  files: [
  {
     src: [],
     dest : 'public/webapp/script/lib/bundle.js',
  }],
  options: {
     require: ['react'],
     browserifyOptions: {
     plugin: [
        ['tsify', {target: 'es2015'}]
     ],
     },
  }
}

После этого ошибка по запросу исчезла, но теперь модуль React не определен. Как будто код в bundle.js плохо импортирован.