Babylon.js 第11节使用babylon开发

babylon.js开发可导入的包：

babylonjs - 巴比伦的核心。
babylonjs-materials - Babylon 支持的高级材料的集合。
babylonjs-loaders - 所有 Babylon 的官方加载器（OBJ，STL，glTF）
babylonjs-post-process - 巴比伦的后期处理。
babylonjs-procedural-textures - 官方支持的程序纹理
babylonjs-serializers - 场景/网格序列化器。
babylonjs-gui -Babylon.js GUI 模块。
babylonjs-viewer - 独立的Babylon.js 查看器。

一、导入和使用

导入包：

npm install --save babylonjs

然后在js中使用babylon:

import * as BABYLON from 'babylonjs';

加载特定的类：

import { Engine, Scene } from 'babylonjs';

导入其他包：

npm install --save babylonjs-materials

在js中使用：

import * as Materials from 'babylonjs-materials';
let skyMaterial = new Materials.SkyMaterial(.....)

如果使用了node.js，还可以用require引入

let BABYLON = require('babylonjs');
let GUI = require('babylonjs-gui');
let materials = require('babylonjs-materials');

如果项目使用了webpack作为打包工具，那么其babylon.js的配置是这样的：

module.exports = {entry: {app: './mygame.ts'},output: {path: path.resolve(__dirname, 'dist'),filename: '[name].js'},resolve: {extensions: ['.ts', '.tsx', '.js']},devtool: 'source-map',plugins: [],module: {rules: [{test: /\.tsx?$/,loader: 'ts-loader',exclude: /node_modules/}]}
}

mygame.ts是项目的入口点。

安装项目的其他依赖包（均为开发环境使用）：

npm install --save-dev webpack
npm install --save-dev webpack-cli
npm install --save-dev typescript
npm install --save-dev ts-loader

使用Babylon.js ES6 包：

@babylonjs/core - 巴比伦的核心。
@babylonjs/materials - 巴比伦支持的高级材料的集合。
@babylonjs/loaders - 所有 Babylon 的官方加载器（OBJ、STL、glTF）
@babylonjs/post-processes - Babylon 的后期处理。
@babylonjs/procedural-textures - 官方支持的程序纹理
@babylonjs/serializers - 场景/网格序列化器。
@babylonjs/gui -Babylon.js GUI 模块。
@babylonjs/inspector - 用于 es 6 的 TheBabylon.js 检查器。

注：不能同时使用Babylon.js ES6的包和往期版本的包。

使用：

import { Engine } from '@babylonjs/core/Engines/engine'
const canvas = document.getElementById("canvas");
const engine = new Engine(canvas, true);

Cannon 和 Oimo：

Cannon 和 Oimo（都是物理引擎）作为依赖项交付，Cannon 和 Oimo 都是可选依赖项。如果您想使用其中任何一个。

npm install oimo

使用：

define('oimo', ['path/to/oimo'], function(OIMO) {return OIMO;
})

这将允许我们的 UMD 定义在 node_modules 中找到 oimo 并使用它。如果您使用 AMD，您需要首先将 oimo 声明为模块（因为 oimo 使用匿名 AMD 定义），然后babylon会将其自动引入。

如果使用了webpack 并且没有安装 cannon 或 oimo，那么会收到警告消息，要解决这个问题需要在webpack中添加：

...,externals: {oimo: 'OIMO', //or truecannon: 'CANNON' //or true},...

Babylon.js 第11节使用babylon开发相关推荐

babylon.js实战教程
致读者最详细的babylon.js实战文档:babylon.js实战中文文档什么是Babylon.js Babylon.js是一个javascript开源框架,用于为Web开发3D应用程序/视频游 ...
babylon.js入门日记系列
一直就有一个给宝宝写游戏的念头.百度一番.选了这个babylon.js(巴比伦).先说好,游戏开发方面我是啥也不会, 要是把你带沟里去了,你也别介意.好了,说干就干,开始......... babyl ...
Babylon.js - 起步
相关网站 Babylon.js 官方网站 Babylon.js 中文网 Babylon.js Github地址 CDN https://cdn.babylonjs.com/babylon.js htt ...
图形化开发（一）——Three.js基本介绍-优缺点-在线编辑器 Babylon.JS是最好的JavaScript3D游戏引擎
图形化开发(一)--Three.js基本介绍-优缺点-在线编辑器 & Babylon.JS是最好的JavaScript3D游戏引擎课程主要学习目标 Threejs ( 3d ) D3 (做数 ...
Babylon.js入门简介和开发实例
Babylon.js是一款WebGL开发框架.和Three.js类似.主要的技术区别是Three.js还试图回退兼容CSS 3D. Three.js是完全社区推动的,比Babylon.js要成熟些,而 ...
webgl 2.0 测试_测试WebGL的极限：Babylon.js培训演示
webgl 2.0 测试为了庆祝Windows 8.1和Internet Explorer 11的发布 ,我们决定为Babylon.js创建一个新的演示场景. 该演示旨在展示Internet Exp ...
Babylon.js 3.3发布：更强大的粒子系统和WebVR支持
Babylon.js 3.3版本利用微软混合现实工具包(MRTK)的功能来改进WebVR开发,并改进了其粒子系统控件. MRTK提供了一系列脚本和组件来加速混合现实应用程序的开发.为了简化GUI VR ...
基于babylon.js的3D网页游戏从零教程
3D 游戏的 javascript 框架: 在很久一段时间 web 端的 3D 游戏引擎一直是 nothing,但现在却如雨后春笋. Unity (Unity 2018.2 开始已经彻底弃用 js,使 ...
Babylon.js 深入
目录 1.第一章动画 1. 设计动画设计剪辑反转动画 2. 动画方法描述创建动画设置关键帧开始动画可动画化 3. 排序动画编辑 (1)设计:对于相机 (2)对于门 (3)对于灯光 4 ...

Babylon.js 第11节使用babylon开发

Babylon.js 第11节使用babylon开发相关推荐

最新文章

热门文章

Babylon.js 第11节 使用babylon开发

Babylon.js 第11节 使用babylon开发相关推荐

最新文章

热门文章

Babylon.js 第11节使用babylon开发

Babylon.js 第11节使用babylon开发相关推荐