Быстрый старт

Для запуска проекта babylon.js на TypeScript требуется некоторая правильная настройка. Самый простой способ - клонировать шаблон с GitHub. Я сделал один здесь:



Разархивируйте и назовите его как хотите, откройте папку с VS Code. Выполните следующее в Терминале.

npm install
npm run build
npm run watch

Вы можете щелкнуть правой кнопкой мыши index.html, чтобы Открыть с помощью Live Server и начать кодирование и тестирование. TypeScript автоматически перестроится при сохранении файла.

Это действительно то, что вам нужно для запуска проекта TypeScript на Babylon JS. Я настоятельно рекомендую TypeScript, так как вы можете получить гораздо лучший опыт по сравнению с JavaScript.

Если вам интересно, насколько точно настроен проект TypeScript, вы можете продолжить чтение остальной части статьи.

За кулисами

Настройка проекта

У вас уже должен быть настроен npm. Если нет, перейдите на официальный сайт для его установки.

Создайте папку для проекта. Откройте папку с кодом Visual Studio.

В коде [Терминал] - ›[Новый терминал]

npm init
npm install --save-dev typescript webpack ts-loader webpack-cli
npm install --save babylonjs@preview babylonjs-loaders@preview babylonjs-gui@preview

Создайте файл с именем webpack.config.js

Создайте tsconfig.json

Файл package.json создается автоматически npm. Добавьте 2 строчки под скрипты.

"scripts": {
    "build": "webpack",
    "watch": "webpack -w",
    "test": "echo \"Error: no test specified\" && exit 1"
},

Написание кода index.html и Typescript

Очень простой index.html.

Создайте папку с именем src для программ машинописного текста. Именно здесь вы и занимаетесь кодированием. Создайте в этой папке файл с именем app.ts. (Это определено в разделе entry в webpack.config.js)

Вы можете написать свою сцену в app.ts.

Строить

npm run build

Чтобы автоматизировать процесс сборки, вы можете сделать

npm run watch

Чтобы увидеть результат, откройте index.html на локальном сервере.

Вуаля. Наслаждайтесь Babylon JS и TypeScript.