Procházet zdrojové kódy

Documentation: Update "Installation" guide with clearer guidance on build tools and CDNs (#25468)

* Remove 'How to run things locally', refresh intro navigation.

* Overhaul Installation, Creating a scene.

* Fix stray link

* Add callout for <version> replacement

* Update links

* Update links

* Clean up

* Update header, 'Importing from a CDN'

* Add aside on package.json and node_modules

* Add aside on npx

* Clean up

* Docs: Simplify installation introduction.
Don McCurdy před 2 roky
rodič
revize
f9ae989944
24 změnil soubory, kde provedl 264 přidání a 1630 odebrání
  1. 13 22
      docs/list.json
  2. 0 140
      docs/manual/ar/introduction/How-to-run-things-locally.html
  3. 1 1
      docs/manual/ar/introduction/Loading-3D-models.html
  4. 36 46
      docs/manual/en/introduction/Creating-a-scene.html
  5. 5 0
      docs/manual/en/introduction/FAQ.html
  6. 0 169
      docs/manual/en/introduction/How-to-run-things-locally.html
  7. 196 87
      docs/manual/en/introduction/Installation.html
  8. 1 1
      docs/manual/en/introduction/Loading-3D-models.html
  9. 3 5
      docs/manual/en/introduction/WebGL-compatibility-check.html
  10. 0 169
      docs/manual/fr/introduction/How-to-run-things-locally.html
  11. 0 167
      docs/manual/it/introduction/How-to-run-things-locally.html
  12. 1 1
      docs/manual/it/introduction/Loading-3D-models.html
  13. 0 149
      docs/manual/ja/introduction/How-to-run-things-locally.html
  14. 1 1
      docs/manual/ja/introduction/Loading-3D-models.html
  15. 0 149
      docs/manual/ko/introduction/How-to-run-things-locally.html
  16. 1 1
      docs/manual/ko/introduction/Loading-3D-models.html
  17. 0 186
      docs/manual/pt-br/introduction/How-to-run-things-locally.html
  18. 1 1
      docs/manual/pt-br/introduction/Loading-3D-models.html
  19. 0 184
      docs/manual/ru/introduction/How-to-run-things-locally.html
  20. 1 1
      docs/manual/ru/introduction/Loading-3D-models.html
  21. 0 147
      docs/manual/zh/introduction/How-to-run-things-locally.html
  22. 1 1
      docs/manual/zh/introduction/Loading-3D-models.html
  23. 2 1
      docs/page.css
  24. 1 1
      test/unit/README.md

+ 13 - 22
docs/list.json

@@ -5,10 +5,9 @@
 		"Manual": {
 
 			"Getting Started": {
-				"Creating a scene": "manual/en/introduction/Creating-a-scene",
 				"Installation": "manual/en/introduction/Installation",
+				"Creating a scene": "manual/en/introduction/Creating-a-scene",
 				"WebGL compatibility check": "manual/en/introduction/WebGL-compatibility-check",
-				"How to run things locally": "manual/en/introduction/How-to-run-things-locally",
 				"Drawing lines": "manual/en/introduction/Drawing-lines",
 				"Creating text": "manual/en/introduction/Creating-text",
 				"Loading 3D models": "manual/en/introduction/Loading-3D-models",
@@ -18,10 +17,10 @@
 			},
 
 			"Next Steps": {
-				"How to update things": "manual/en/introduction/How-to-update-things",
-				"How to dispose of objects": "manual/en/introduction/How-to-dispose-of-objects",
-				"How to create VR content": "manual/en/introduction/How-to-create-VR-content",
-				"How to use post-processing": "manual/en/introduction/How-to-use-post-processing",
+				"Updating resources": "manual/en/introduction/How-to-update-things",
+				"Disposing resources": "manual/en/introduction/How-to-dispose-of-objects",
+				"Creating VR content": "manual/en/introduction/How-to-create-VR-content",
+				"Post-processing": "manual/en/introduction/How-to-use-post-processing",
 				"Matrix transformations": "manual/en/introduction/Matrix-transformations",
 				"Animation system": "manual/en/introduction/Animation-system",
 				"Color management": "manual/en/introduction/Color-management"
@@ -446,10 +445,9 @@
 		"الكتيب": {
 
 			"البدء": {
-				"إنشاء مشهد": "manual/ar/introduction/Creating-a-scene",
 				"التثبيت": "manual/ar/introduction/Installation",
+				"إنشاء مشهد": "manual/ar/introduction/Creating-a-scene",
 				"فحص توافق WebGL": "manual/ar/introduction/WebGL-compatibility-check",
-				"كيف تدير الأشياء محليًا": "manual/ar/introduction/How-to-run-things-locally",
 				"رسم خطوط": "manual/ar/introduction/Drawing-lines",
 				"إنشاء نص": "manual/ar/introduction/Creating-text",
 				"تحميل نماذج ثلاثية الأبعاد": "manual/ar/introduction/Loading-3D-models",
@@ -517,10 +515,9 @@
 		"手册": {
 
 			"起步": {
-				"创建一个场景": "manual/zh/introduction/Creating-a-scene",
 				"安装": "manual/zh/introduction/Installation",
+				"创建一个场景": "manual/zh/introduction/Creating-a-scene",
 				"WebGL兼容性检查": "manual/zh/introduction/WebGL-compatibility-check",
-				"如何在本地运行Three.js": "manual/zh/introduction/How-to-run-things-locally",
 				"画线": "manual/zh/introduction/Drawing-lines",
 				"创建文字": "manual/zh/introduction/Creating-text",
 				"载入3D模型": "manual/zh/introduction/Loading-3D-models",
@@ -908,10 +905,9 @@
 		"매뉴얼": {
 
 			"시작하기": {
-				"장면 만들기": "manual/ko/introduction/Creating-a-scene",
 				"설치": "manual/ko/introduction/Installation",
+				"장면 만들기": "manual/ko/introduction/Creating-a-scene",
 				"WebGL 호환성 검사": "manual/ko/introduction/WebGL-compatibility-check",
-				"로컬 환경에서 구동 방법": "manual/ko/introduction/How-to-run-things-locally",
 				"선 그리기": "manual/ko/introduction/Drawing-lines",
 				"텍스트 만들기": "manual/ko/introduction/Creating-text",
 				"3D 모델 불러오기": "manual/ko/introduction/Loading-3D-models",
@@ -1082,10 +1078,9 @@
 		"マニュアル": {
 
 			"はじめてみましょう": {
-				"シーンの作成": "manual/ja/introduction/Creating-a-scene",
 				"インストールの方法": "manual/ja/introduction/Installation",
+				"シーンの作成": "manual/ja/introduction/Creating-a-scene",
 				"WebGLの互換性の確認": "manual/ja/introduction/WebGL-compatibility-check",
-				"localで実行する方法": "manual/ja/introduction/How-to-run-things-locally",
 				"線を引く": "manual/ja/introduction/Drawing-lines",
 				"テキストを作成する": "manual/ja/introduction/Creating-text",
 				"3Dモデルをロードする": "manual/ja/introduction/Loading-3D-models",
@@ -1116,10 +1111,9 @@
 		"Manuale": {
 
 			"Per iniziare": {
-				"Creare una scena": "manual/it/introduction/Creating-a-scene",
 				"Installazione": "manual/it/introduction/Installation",
+				"Creare una scena": "manual/it/introduction/Creating-a-scene",
 				"Controllo compatibilità WebGL": "manual/it/introduction/WebGL-compatibility-check",
-				"Esecuzione in locale": "manual/it/introduction/How-to-run-things-locally",
 				"Disegnare linee": "manual/it/introduction/Drawing-lines",
 				"Creare testo": "manual/it/introduction/Creating-text",
 				"Caricare modelli 3D": "manual/it/introduction/Loading-3D-models",
@@ -1442,10 +1436,9 @@
 		"Manual": {
 
 			"Comece a usar": {
-				"Criando uma cena": "manual/pt-br/introduction/Creating-a-scene",
 				"Instalação": "manual/pt-br/introduction/Installation",
+				"Criando uma cena": "manual/pt-br/introduction/Creating-a-scene",
 				"Compatibilidade WebGL": "manual/pt-br/introduction/WebGL-compatibility-check",
-				"Como executar localmente": "manual/pt-br/introduction/How-to-run-things-locally",
 				"Desenhando linhas": "manual/pt-br/introduction/Drawing-lines",
 				"Criando texto": "manual/pt-br/introduction/Creating-text",
 				"Carregando modelos 3D": "manual/pt-br/introduction/Loading-3D-models",
@@ -1528,10 +1521,9 @@
 		"Manuel": {
 
 			"Débuter": {
-				"Créer une scène": "manual/fr/introduction/Creating-a-scene",
 				"Installation": "manual/fr/introduction/Installation",
+				"Créer une scène": "manual/fr/introduction/Creating-a-scene",
 				"Compatibilité WebGL": "manual/fr/introduction/WebGL-compatibility-check",
-				"Exécuter localement": "manual/fr/introduction/How-to-run-things-locally",
 				"Dessiner des lignes": "manual/fr/introduction/Drawing-lines",
 				"Créer un texte": "manual/fr/introduction/Creating-text",
 				"Importer des modèles 3D": "manual/fr/introduction/Loading-3D-models",
@@ -1661,10 +1653,9 @@
 		"Руководство": {
 
 			"Приступая к работе": {
-				"Создание сцены": "manual/ru/introduction/Creating-a-scene",
 				"Установка": "manual/ru/introduction/Installation",
+				"Создание сцены": "manual/ru/introduction/Creating-a-scene",
 				"Проверка совместимости с WebGL": "manual/ru/introduction/WebGL-compatibility-check",
-				"Локальная разработка ": "manual/ru/introduction/How-to-run-things-locally",
 				"Рисование линий": "manual/ru/introduction/Drawing-lines",
 				"Создание текста": "manual/ru/introduction/Creating-text",
 				"Загрузка 3D-моделей": "manual/ru/introduction/Loading-3D-models",

+ 0 - 140
docs/manual/ar/introduction/How-to-run-things-locally.html

@@ -1,140 +0,0 @@
-<!DOCTYPE html>
-<html lang="ar">
-	<head>
-		<meta charset="utf-8">
-		<base href="../../../" />
-		<script src="page.js"></script>
-		<link type="text/css" rel="stylesheet" href="page.css" />
-	</head>
-	<body class="rtl">
-		<h1>كيف تدير الأشياء محليًا</h1>
-		<p>
-			إذا كنت تستخدم الأشكال الهندسية الإجرائية فقط ولا تقوم بتحميل أي مواد ، فيجب أن تعمل صفحات الويب مباشرة من نظام الملفات ، فقط انقر نقرًا مزدوجًا فوق ملف HTML في مدير الملفات
-			يجب أن يعرض محتوى الصفحة في المتصفح (سترى <em>file:///yourFile.html</em> في شريط العناوين).
-		</p>
-
-		<h2>المحتوى الذي تم تحميله من ملفات خارجية</h2>
-		<div>
-			<p>
-				إذا قمت بتحميل نماذج وأنسجة من ملفات خارجية ، نظرًا لقيود أمان المتصفحات [link:http://en.wikipedia.org/wiki/Same_origin_policy same origin policy] ، فسيفشل التحميل من نظام الملفات مع استثناء أمان.
-		 	</p>
-
-			<p>هناك طريقتان لحل هذا:</p>
-
-			<ol>
-				<li>
-					قم بتغيير أمان الملفات المحلية في المستعرض. يتيح لك ذلك الوصول إلى صفحتك على النحو التالي: <code>file:///yourFile.html</code>
-				</li>
-				<li>
-					قم بتشغيل الملفات من خادم ويب محلي. يتيح لك هذا الوصول إلى صفحتك على النحو التالي: <code>http://localhost/yourFile.html</code>
-				</li>
-			</ol>
-
-			<p>
-				إذا كنت تستخدم الخيار 1 ، فاعلم أنك قد تفتح نفسك لبعض نقاط الضعف إذا كنت تستخدم نفس المتصفح لتصفح الويب. قد ترغب في إنشاء ملف تعريف / اختصار متصفح منفصل يستخدم فقط للتطور لتكون في مأمن. دعنا نمر إلى كل خيار على حدة.
-			</p>
-		</div>
-
-
-		<h2>قم بتشغيل خادم محلي</h2>
-		<div>
-			<p>
-				تحتوي العديد من لغات البرمجة على خوادم HTTP بسيطة مضمنة فيها. فهي ليست كاملة الميزات مثل خوادم الإنتاج مثل [link:https://www.apache.org/ Apache] أو [link:https://nginx.org NGINX] ، ولكن يجب أن تكون كافية لاختبار تطبيق three.js الخاص بك.
-			</p>
-
-			<h3>إضافات لمحررات الأكواد الأكثر إستعمالا</h3>
-			<div>
-				<p>تحتوي بعض برامج تحرير الأكواد على مكونات إضافية والتي ستنتج خادمًا بسيطًا عند الطلب.</p>
-				<ul>
-					<li>[link:https://marketplace.visualstudio.com/items?itemName=ritwickdey.LiveServer Live Server] لـ Visual Studio Code.</li>
-					<li>[link:https://atom.io/packages/atom-live-server Live Server] لـ Atom.</li>
-				</ul>
-			</div>
-
-			<h3>Servez</h3>
-			<div>
-				<p>
-					[link:https://greggman.github.io/servez Servez] هو خادم بسيط مع واجهة المستخدم.
-				</p>
-			</div>
-
-			<h3>Node.js http-server</h3>
-			<div>
-				<p>يحتوي Node.js على حزمة خادم HTTP بسيطة. لتثبيت:</p>
-				<code>npm install http-server -g</code>
-
-				<p>للتشغيل (من دليلك المحلي):</p>
-				<code>http-server . -p 8000</code>
-			</div>
-
-			<h3>خادم Python</h3>
-			<div>
-				<p>
-					إذا كان لديك [link:http://python.org/ Python] مثبتًا ، فيجب أن يكون كافيًا لتشغيل هذا من سطر أوامر (من دليل العمل الخاص بك):
-				</p>
-				<code>
-//Python 2.x
-python -m SimpleHTTPServer
-
-//Python 3.x
-python -m http.server
-				</code>
-
-				<p>سيخدم هذا الملفات من الدليل الحالي في المضيف المحلي تحت المنفذ 8000 ، كمثال في شريط العنوان اكتب:</p>
-
-				<code>http://localhost:8000/</code>
-			</div>
-
-			<h3>خادم Ruby</h3>
-			<div>
-				<p>إذا قمت بتثبيت Ruby ، فيمكنك الحصول على نفس النتيجة بتشغيل هذا بدلاً من ذلك:</p>
-				<code>
-ruby -r webrick -e "s = WEBrick::HTTPServer.new(:Port => 8000, :DocumentRoot => Dir.pwd); trap('INT') { s.shutdown }; s.start"
-				</code>
-			</div>
-
-			<h3>خادم PHP</h3>
-			<div>
-				<p>تحتوي PHP أيضًا على خادم ويب مدمج ، بدءًا من php 5.4.0:</p>
-				<code>php -S localhost:8000</code>
-			</div>
-
-			<h3>Lighttpd</h3>
-			<div>
-				<p>
-					Lighttpd هو خادم ويب خفيف الوزن للغاية للأغراض العامة. سنغطي تثبيته على OSX مع HomeBrew هنا. على عكس الخوادم الأخرى التي تمت مناقشتها هنا ، فإن lighttpd هو خادم جاهز للإنتاج الكامل.
-				</p>
-
-				<ol>
-					<li>
-						تثبيته بواسطة homebrew
-						<code>brew install lighttpd</code>
-					</li>
-					<li>
-						قم بإنشاء ملف ترتيب (configuration) يسمى lighttpd.conf في المجلد حيث تريد تشغيل خادم الويب الخاص بك. يوجد نموذج [link:http://redmine.lighttpd.net/projects/lighttpd/wiki/TutorialConfiguration here].
-					 </li>
-					<li>
-						في ملف conf ، قم بتغيير server.document-root إلى الدليل الذي تريد خدمة الملفات منه.
-					</li>
-					<li>
-						شغله من خلال الأمر التالي:
-						<code>lighttpd -f lighttpd.conf</code>
-					</li>
-					<li>
-						انتقل إلى http://localhost:3000 وسيخدم الملفات الثابتة من الدليل الذي تختاره.
-					</li>
-				</ol>
-			</div>
-			<h3>IIS</h3>
-			<div>
-				<p>إذا كنت تستخدم Microsoft IIS كخادم ويب. الرجاء إضافة إعدادات نوع MIME فيما يتعلق بامتداد .fbx قبل التحميل.</p>
-				<code>File name extension: fbx        MIME Type: text/plain</code>
-				<p>بشكل تلقائي ، يقوم IIS بحظر تنزيل ملفات .fbx و .obj. يجب عليك تعديل IIS لتمكين تنزيل هذا النوع من الملفات.</p>
-			</div>
-			<p>
-				تمت مناقشة البدائل البسيطة الأخرى هنا [link:http://stackoverflow.com/q/12905426/24874 here] على Stack Overflow.
-			</p>
-		</div>
-
-	</body>
-</html>

+ 1 - 1
docs/manual/ar/introduction/Loading-3D-models.html

@@ -24,7 +24,7 @@
 	<h2>قبل أن نبدأ</h2>
 
 	<p>
-		إذا كنت جديدًا في تشغيل خادم محلي ، فابدأ بكيفية إدارة الأشياء محليًا [link:#manual/introduction/How-to-run-things-locally how to run things locally] أولاً. يمكن تجنب العديد من الأخطاء الشائعة أثناء عرض النماذج ثلاثية الأبعاد عن طريق استضافة الملفات بشكل صحيح.
+		إذا كنت جديدًا في تشغيل خادم محلي ، فابدأ بكيفية إدارة الأشياء محليًا [link:#manual/introduction/Installation installation] أولاً. يمكن تجنب العديد من الأخطاء الشائعة أثناء عرض النماذج ثلاثية الأبعاد عن طريق استضافة الملفات بشكل صحيح.
 	</p>
 
 	<h2>سير العمل الموصى به</h2>

+ 36 - 46
docs/manual/en/introduction/Creating-a-scene.html

@@ -13,35 +13,19 @@
 
 		<h2>Before we start</h2>
 
-		<p>Before you can use three.js, you need somewhere to display it. Save the following HTML to a file on your computer and open it in your browser.</p>
-
-		<code>
-		&lt;!DOCTYPE html&gt;
-		&lt;html&gt;
-			&lt;head&gt;
-				&lt;meta charset="utf-8"&gt;
-				&lt;title&gt;My first three.js app&lt;/title&gt;
-				&lt;style&gt;
-					body { margin: 0; }
-				&lt;/style&gt;
-			&lt;/head&gt;
-			&lt;body&gt;
-				&lt;script type="module"&gt;
-					import * as THREE from 'https://unpkg.com/three/build/three.module.js';
-
-					// Our Javascript will go here.
-				&lt;/script&gt;
-			&lt;/body&gt;
-		&lt;/html&gt;
-		</code>
-
-		<p>That's all. All the code below goes into the empty &lt;script&gt; tag.</p>
+		<p>
+			If you haven't yet, go through the [link:#manual/introduction/Installation Installation] guide. We'll assume you've already set up the same project structure (including <i>index.html</i> and <i>main.js</i>), have installed three.js, and are either running a build tool, or using a local server with a CDN and import maps.
+		</p>
 
 		<h2>Creating the scene</h2>
 
 		<p>To actually be able to display anything with three.js, we need three things: scene, camera and renderer, so that we can render the scene with camera.</p>
 
+		<p><i>main.js —</i></p>
+
 		<code>
+		import * as THREE from 'three';
+
 		const scene = new THREE.Scene();
 		const camera = new THREE.PerspectiveCamera( 75, window.innerWidth / window.innerHeight, 0.1, 1000 );
 
@@ -117,10 +101,12 @@
 
 		<p>The full code is available below and as an editable [link:https://jsfiddle.net/em4j9hvu/ live example]. Play around with it to get a better understanding of how it works.</p>
 
+		<p><i>index.html —</i></p>
+
 		<code>
 		&lt;!DOCTYPE html&gt;
 		&lt;html&gt;
-			&lt;head&gt;
+			&lt;head lang="en"&gt;
 				&lt;meta charset="utf-8"&gt;
 				&lt;title&gt;My first three.js app&lt;/title&gt;
 				&lt;style&gt;
@@ -128,36 +114,40 @@
 				&lt;/style&gt;
 			&lt;/head&gt;
 			&lt;body&gt;
-				&lt;script type="module"&gt;
-					import * as THREE from 'https://unpkg.com/three/build/three.module.js';
+				&lt;script type="module" src="/main.js"&gt;&lt;/script&gt;
+			&lt;/body&gt;
+		&lt;/html&gt;
+		</code>
 
-					const scene = new THREE.Scene();
-					const camera = new THREE.PerspectiveCamera( 75, window.innerWidth / window.innerHeight, 0.1, 1000 );
+		<p><i>main.js —</i></p>
 
-					const renderer = new THREE.WebGLRenderer();
-					renderer.setSize( window.innerWidth, window.innerHeight );
-					document.body.appendChild( renderer.domElement );
+		<code>
+		import * as THREE from 'three';
 
-					const geometry = new THREE.BoxGeometry( 1, 1, 1 );
-					const material = new THREE.MeshBasicMaterial( { color: 0x00ff00 } );
-					const cube = new THREE.Mesh( geometry, material );
-					scene.add( cube );
+		const scene = new THREE.Scene();
+		const camera = new THREE.PerspectiveCamera( 75, window.innerWidth / window.innerHeight, 0.1, 1000 );
 
-					camera.position.z = 5;
+		const renderer = new THREE.WebGLRenderer();
+		renderer.setSize( window.innerWidth, window.innerHeight );
+		document.body.appendChild( renderer.domElement );
 
-					function animate() {
-						requestAnimationFrame( animate );
+		const geometry = new THREE.BoxGeometry( 1, 1, 1 );
+		const material = new THREE.MeshBasicMaterial( { color: 0x00ff00 } );
+		const cube = new THREE.Mesh( geometry, material );
+		scene.add( cube );
 
-						cube.rotation.x += 0.01;
-						cube.rotation.y += 0.01;
+		camera.position.z = 5;
 
-						renderer.render( scene, camera );
-					}
+		function animate() {
+			requestAnimationFrame( animate );
 
-					animate();
-				&lt;/script&gt;
-			&lt;/body&gt;
-		&lt;/html&gt;
+			cube.rotation.x += 0.01;
+			cube.rotation.y += 0.01;
+
+			renderer.render( scene, camera );
+		}
+
+		animate();
 		</code>
 	</body>
 </html>

+ 5 - 0
docs/manual/en/introduction/FAQ.html

@@ -56,5 +56,10 @@ visible_height = 2 * Math.tan( ( Math.PI / 180 ) * camera.fov / 2 ) * distance_f
 		<p>
 			For performance reasons, three.js doesn't validate inputs in most cases. It's your app's responsibility to make sure that all inputs are valid.
 		</p>
+
+		<h2>Can I use three.js in Node.js?</h2>
+		<p>
+			Because three.js is built for the web, it depends on browser and DOM APIs that don't always exist in Node.js. Some of these issues can be avoided by using shims like [link:https://github.com/stackgl/headless-gl headless-gl] and [link:https://github.com/rstacruz/jsdom-global jsdom-global], or by replacing components like [page:TextureLoader] with custom alternatives. Other DOM APIs may be deeply intertwined with the code that uses them, and will be harder to work around. We welcome simple and maintainable pull requests to improve Node.js support, but recommend opening an issue to discuss your improvements first.
+		</p>
 	</body>
 </html>

+ 0 - 169
docs/manual/en/introduction/How-to-run-things-locally.html

@@ -1,169 +0,0 @@
-<!DOCTYPE html>
-<html lang="en">
-	<head>
-		<meta charset="utf-8">
-		<base href="../../../" />
-		<script src="page.js"></script>
-		<link type="text/css" rel="stylesheet" href="page.css" />
-	</head>
-	<body>
-		<h1>[name]</h1>
-		<p>
-			If you use just procedural geometries and don't load any textures, webpages should work
-			straight from the file system, just double-click on HTML file in a file manager and it
-			should appear working in the browser (you'll see <em>file:///yourFile.html</em> in the address bar).
-		</p>
-
-		<h2>Content loaded from external files</h2>
-		<div>
-			<p>
-				If you load models or textures from external files, due to browsers' [link:http://en.wikipedia.org/wiki/Same_origin_policy same origin policy]
-			 	security restrictions, loading from a file system will fail with a security exception.
-		 	</p>
-
-			<p>
-				To solve this, run files from a local web server. This allows you to access your page as:
-			</p>
-			
-			<p>
-				<code>http://localhost/yourFile.html</code>
-			</p>
-
-			<p>
-				While it is also possible to change browser security settings instead of running a local server,
-				we do not recommend that approach. Doing so may open your device up to vulnerabilities, if the
-				same browser is used for regular web surfing. Use of a local server is standard practice in 
-				web development, and we explain how to install and use a local server below.
-			</p>
-		</div>
-
-
-		<h2>Run a local server</h2>
-		<div>
-			<p>
-				Many programming languages have simple HTTP servers built in. They are not as full featured as
-				production servers such as [link:https://www.apache.org/ Apache] or [link:https://nginx.org NGINX], however they should be sufficient for testing your
-				three.js application.
-			</p>
-
-			<h3>Plugins for popular code editors</h3>
-			<div>
-				<p>Some code editors have plugins which will spawn a simple server on demand.</p>
-				<ul>
-					<li>[link:https://marketplace.visualstudio.com/items?itemName=yandeu.five-server Five Server] for Visual Studio Code.</li>
-					<li>[link:https://marketplace.visualstudio.com/items?itemName=ritwickdey.LiveServer Live Server] for Visual Studio Code.</li>
-					<li>[link:https://atom.io/packages/atom-live-server Live Server] for Atom.</li>
-				</ul>
-			</div>
-
-			<h3>Servez</h3>
-			<div>
-				<p>
-					[link:https://greggman.github.io/servez Servez] is a simple server with a GUI.
-				</p>
-			</div>
-
-			<h3>Node.js five-server</h3>
-			<div>
-				<p>Development server with live reload capability. To install:</p>
-				<code>
-# Remove live-server (if you have it)
-npm -g rm live-server
-
-# Install five-server
-npm -g i five-server
-
-# Update five-server (from time to time)
-npm -g i five-server@latest
-				</code>
-
-				<p>To run (from your local directory):</p>
-				<code>five-server . -p 8000</code>
-			</div>
-
-			<h3>Node.js http-server</h3>
-			<div>
-				<p>Node.js has a simple HTTP server package. To install:</p>
-				<code>npm install http-server -g</code>
-
-				<p>To run (from your local directory):</p>
-				<code>http-server . -p 8000</code>
-			</div>
-
-			<h3>Python server</h3>
-			<div>
-				<p>
-					If you have [link:http://python.org/ Python] installed, it should be enough to run this
-					from a command line (from your working directory):
-				</p>
-				<code>
-//Python 2.x
-python -m SimpleHTTPServer
-
-//Python 3.x
-python -m http.server
-				</code>
-
-				<p>This will serve files from the current directory at localhost under port 8000, i.e in the address bar type:</p>
-
-				<code>http://localhost:8000/</code>
-			</div>
-
-			<h3>Ruby server</h3>
-			<div>
-				<p>If you have Ruby installed, you can get the same result running this instead:</p>
-				<code>
-ruby -r webrick -e "s = WEBrick::HTTPServer.new(:Port => 8000, :DocumentRoot => Dir.pwd); trap('INT') { s.shutdown }; s.start"
-				</code>
-			</div>
-
-			<h3>PHP server</h3>
-			<div>
-				<p>PHP also has a built-in web server, starting with php 5.4.0:</p>
-				<code>php -S localhost:8000</code>
-			</div>
-
-			<h3>Lighttpd</h3>
-			<div>
-				<p>
-					Lighttpd is a very lightweight general purpose webserver. We'll cover installing it on OSX with
-					HomeBrew here. Unlike the other servers discussed here, lighttpd is a full fledged production
-					ready server.
-				</p>
-
-				<ol>
-					<li>
-						Install it via homebrew
-						<code>brew install lighttpd</code>
-					</li>
-					<li>
-						Create a configuration file called lighttpd.conf in the directory where you want to run
-						your webserver. There is a sample [link:http://redmine.lighttpd.net/projects/lighttpd/wiki/TutorialConfiguration here].
-					 </li>
-					<li>
-						In the conf file, change the server.document-root to the directory you want to serve files from.
-					</li>
-					<li>
-						Start it with
-						<code>lighttpd -f lighttpd.conf</code>
-					</li>
-					<li>
-						Navigate to http://localhost:3000/ and it will serve static files from the directory you
-						chose.
-					</li>
-				</ol>
-			</div>
-			<h3>IIS</h3>
-			<div>
-				<p>If you are using Microsoft IIS as web server. Please add a MIME type settings regarding .fbx extension before loading.</p>
-				<code>File name extension: fbx        MIME Type: text/plain</code>
-				<p>By default, IIS blocks .fbx, .obj files downloads. You have to configure IIS to enable these kind of files can be download.</p>
-			</div>
-			<p>
-				Other simple alternatives are [link:http://stackoverflow.com/q/12905426/24874 discussed here]
-				on Stack Overflow.
-			</p>
-		</div>
-
-	</body>
-</html>

+ 196 - 87
docs/manual/en/introduction/Installation.html

@@ -9,150 +9,259 @@
 	<body>
 		<h1>[name]</h1>
 
-		<p>
-			You can install three.js with [link:https://www.npmjs.com/ npm] and modern build tools, or get started quickly with just static hosting or a CDN. For most users, installing from npm is the best choice.
-		</p>
+		<h2>Project structure</h2>
 
 		<p>
-			Whichever you choose, be consistent and import all files from the same version of the library. Mixing files from different sources may cause duplicate code to be included, or even break the application in unexpected ways.
+			Every three.js project needs at least one HTML file to define the webpage, and a JavaScript file to run your three.js code. The structure and naming choices below aren't required, but will be used throughout this guide for consistency.
 		</p>
 
+		<ul>
+			<li>
+				<i>index.html</i>
+				<code>
+		&lt;!DOCTYPE html&gt;
+		&lt;html lang="en"&gt;
+			&lt;head&gt;
+				&lt;meta charset="utf-8"&gt;
+				&lt;title&gt;My first three.js app&lt;/title&gt;
+				&lt;style&gt;
+					body { margin: 0; }
+				&lt;/style&gt;
+			&lt;/head&gt;
+			&lt;body&gt;
+				&lt;script type="module" src="/main.js"&gt;&lt;/script&gt;
+			&lt;/body&gt;
+		&lt;/html&gt;
+				</code>
+			</li>
+			<li>
+				<i>main.js</i>
+				<code>
+import * as THREE from 'three';
+
+...
+				</code>
+			</li>
+			<li>
+				<i>public/</i>
+				<ul>
+					<li>
+						The <i>public/</i> folder is sometimes also called a "static" folder, because the files it contains are pushed to the website unchanged. Usually textures, audio, and 3D models will go here.
+					</li>
+				</ul>
+			</li>
+		</ul>
+
 		<p>
-			All methods of installing three.js depend on ES modules (see [link:https://eloquentjavascript.net/10_modules.html#h_hF2FmOVxw7 Eloquent JavaScript: ECMAScript Modules]), which allow you to include only the parts of the library needed in the final project.
+			Now that we've set up the basic project structure, we need a way to run the project locally and access it through a web browser. Installation and local development can be accomplished with npm and a build tool, or by importing three.js from a CDN. Both options are explained in the sections below.
 		</p>
 
-		<h2>Install from npm</h2>
+		<h2>Option 1: Install with NPM and a build tool</h2>
+
+		<h3>Development</h3>
 
 		<p>
-			To install the [link:https://www.npmjs.com/package/three three] npm module, open a terminal window in your project folder and run:
+			Installing from the [link:https://www.npmjs.com/ npm package registry] and using a [link:https://eloquentjavascript.net/10_modules.html#h_zWTXAU93DC build tool] is the recommended approach for most users — the more dependencies your project needs, the more likely you are to run into problems that the static hosting cannot easily resolve. With a build tool, importing local JavaScript files and npm packages should work out of the box, without import maps.
 		</p>
 
-		<code>
-		npm install three
-		</code>
+
+		<ol>
+			<li>
+				Install [link:https://nodejs.org/ Node.js]. We'll need it to load manage dependencies and to run our build tool.
+			</li>
+			<li>
+				<p>
+					Install three.js and a build tool, [link:https://vitejs.dev/ Vite], using a [link:https://www.joshwcomeau.com/javascript/terminal-for-js-devs/ terminal] in your project folder. Vite will be used during development, but it isn't part of the final webpage. If you prefer to use another build tool, that's fine — we support modern build tools that can import [link:https://eloquentjavascript.net/10_modules.html#h_zWTXAU93DC ES Modules].
+				</p>
+				<code>
+# three.js
+npm install --save three
+
+# vite
+npm install --save-dev vite
+				</code>
+				<aside>
+					<details>
+						<summary>Installation added <i>node_modules/</i> and <i>package.json</i> to my project. What are they?</summary>
+						<p>
+							npm uses <i>package.json</i> to describe which versions of each dependency you've installed. If you have other people working on the project with you, they can install the original versions of each dependency simply by running <i>npm install</i>. If you're using version history, commit <i>package.json</i>.
+						</p>
+						<p>
+							npm the code for each dependency in a new <i>node_modules/</i> folder. When Vite builds your application, it sees imports for 'three' and pulls three.js files automatically from this folder. The <i>node_modules/</i> folder is used only during development, and shouldn't be uploaded to your web hosting provider or committed to version history.
+						</p>
+					</details>
+				</aside>
+			</li>
+			<li>
+				From your terminal, run:
+				<code>
+					npx vite
+				</code>
+				<aside>
+					<details>
+						<summary>What is <i>npx</i>?</summary>
+						<p>
+							npx is installed with Node.js, and runs command line programs like Vite so that you don't have to search for the right file in <i>node_modules/</i> yourself. If you prefer, you can put [link:https://vitejs.dev/guide/#command-line-interface Vite's common commands] into the [link:https://docs.npmjs.com/cli/v9/using-npm/scripts package.json:scripts] list, and use <i>npm run dev</i> instead.
+						</p>
+					</details>
+				</aside>
+			</li>
+			<li>
+				If everything went well, you'll see a URL like <i>http://localhost:5173</i> appear in your terminal, and can open that URL to see your web application.
+			</li>
+		</ol>
 
 		<p>
-			The package will be downloaded and installed. Then you're ready to import it in your code:
+			The page will be blank — you're ready to [link:#manual/introduction/Creating-a-scene create a scene].
 		</p>
 
-		<code>
-		// Option 1: Import the entire three.js core library.
-		import * as THREE from 'three';
-
-		const scene = new THREE.Scene();
-
+		<p>
+			If you want to learn more about these tools before you continue, see:
+		</p>
 
-		// Option 2: Import just the parts you need.
-		import { Scene } from 'three';
+		<ul>
+			<li>
+				[link:https://threejs-journey.com/lessons/local-server three.js journey: Local Server]
+			</li>
+			<li>
+				 [link:https://vitejs.dev/guide/cli.html Vite: Command Line Interface]
+			</li>
+			<li>
+				[link:https://developer.mozilla.org/en-US/docs/Learn/Tools_and_testing/Understanding_client-side_tools/Package_management MDN: Package management basics]
+			</li>
+		</ul>
 
-		const scene = new Scene();
-		</code>
+		<h3>Production</h3>
 
 		<p>
-			When installing from npm, you'll almost always use some sort of [link:https://eloquentjavascript.net/10_modules.html#h_zWTXAU93DC bundling tool] to combine all of the packages your project requires into a single JavaScript file. While any modern JavaScript bundler can be used with three.js, the most popular choice is [link:https://webpack.js.org/ webpack].
+			Later, when you're ready to deploy your web application, you'll just need to tell Vite to run a production build — <i>npx vite build</i>. Everything used by the application will be compiled, optimized, and copied into the <i>dist/</i> folder. The contents of that folder are ready to be hosted on your website.
 		</p>
 
+		<h2>Option 2: Import from a CDN</h2>
+
+		<h3>Development</h3>
+
+		<p>Installing without build tools will require some changes to the project structure given above.</p>
+
+		<ol>
+			<li>
+				<p>
+					We imported code from 'three' (an npm package) in <i>main.js</i>, and web browsers don't know what that means. In <i>index.html</i> we'll need to add an [link:https://developer.mozilla.org/en-US/docs/Web/HTML/Element/script/type/importmap import map] defining where to get the package. Put the code below inside the <i>&lt;head>&lt/head></i> tag, after the styles.
+				</p>
+				<code>
+&lt;script async src="https://unpkg.com/[email protected]/dist/es-module-shims.js">&lt;/script>
+
+&lt;script type="importmap">
+  {
+    "imports": {
+      "three": "https://unpkg.com/three@&lt;version&gt;/build/three.module.js",
+      "three/addons/": "https://unpkg.com/three@&lt;version&gt;/examples/jsm/"
+    }
+  }
+&lt;/script>
+				</code>
+				<p>
+					Don't forget to replace <i>&lt;version&gt;</i> with an actual version of three.js, like <i>"v0.149.0"</i>. The most recent version can be found on the [link:https://www.npmjs.com/package/three?activeTab=versions npm version list]. Because import maps are [link:https://caniuse.com/import-maps not yet supported] by some major browsers, we include the polyfill <i>es-module-shims.js</i>.
+				</p>
+			</li>
+			<li>
+				<p>
+					We'll also need to run a <i>local server</i> to host these files at URL where the web browser can access them. While it's technically possible to double-click an HTML file and open it in your browser, important features that we'll later do not work when the page is opened this way, for security reasons.
+				</p>
+				<p>
+					Install [link:https://nodejs.org/ Node.js], then run [link:https://www.npmjs.com/package/serve serve] to start a local server in the project's directory:
+				</p>
+				<code>
+					npx serve .
+				</code>
+			</li>
+			<li>
+				If everything went well, you'll see a URL like http://localhost:3000 appear in your terminal, and can open that URL to see your web application.
+			</li>
+		</ol>
+
 		<p>
-			Not all features are accessed directly through the <em>three</em> module (also called a "bare import"). Other popular parts of the library — such as controls, loaders, and post-processing effects — must be imported from the [link:https://github.com/mrdoob/three.js/tree/dev/examples/jsm examples/jsm] subfolder. To learn more, see <em>Examples</em> below.
+			The page will be blank — you're ready to [link:#manual/introduction/Creating-a-scene create a scene].
 		</p>
 
 		<p>
-			Learn more about npm modules from [link:https://eloquentjavascript.net/20_node.html#h_J6hW/SmL/a Eloquent JavaScript: Installing with npm].
+			Many other local static servers are available — some use different languages instead of Node.js, and others are desktop applications. They all work basically the same way, and we've provided a few alternatives below.
 		</p>
 
-		<h2>Install from CDN or static hosting</h2>
+		<details>
+			<summary>More local servers</summary>
 
-		<p>
-			The three.js library can be used without any build system, either by uploading files to your own web server or by using an existing CDN. Because the library relies on ES modules, any script that references it must use <em>type="module"</em> as shown below.
-			It is also required to define an import map which resolves the bare module specifier `three`.
-		</p>
+			<h3>Command Line</h3>
 
-		<code>
-		&lt;script async src="https://unpkg.com/[email protected]/dist/es-module-shims.js">&lt;/script>
+			<p>Command line local servers run from a terminal window. The associated programming language may need to be installed first.</p>
 
-		&lt;script type="importmap">
-		  {
-		    "imports": {
-		      "three": "https://unpkg.com/three@&lt;version&gt;/build/three.module.js"
-		    }
-		  }
-		&lt;/script>
+			<ul>
+				<li><i>npx http-server</i> (Node.js)</li>
+				<li><i>npx five-server</i> (Node.js)</li>
+				<li><i>python -m SimpleHTTPServer</i> (Python 2.x)</li>
+				<li><i>python -m http.server</i> (Python 3.x)</li>
+				<li><i>php -S localhost:8000</i> (PHP 5.4+)</li>
+			</ul>
 
-		&lt;script type="module">
 
-		  import * as THREE from 'three';
+			<h3>GUI</h3>
 
-		  const scene = new THREE.Scene();
+			<p>GUI local servers run as an application window on your computer, and may have a user interface.</p>
 
-		&lt;/script>
-		</code>
+			<ul>
+				<li>[link:https://greggman.github.io/servez Servez]</li>
+			</ul>
 
-		<p>
-			Since import maps are not yet supported by all browsers, it is necessary to add the polyfill *es-module-shims.js*.
-		</p>
+			<h3>Code Editor Plugins</h3>
 
-		<h2>Addons</h2>
+			<p>Some code editors have plugins that spawn a simple server on demand.</p>
+
+			<ul>
+				<li>[link:https://marketplace.visualstudio.com/items?itemName=yandeu.five-server Five Server] for Visual Studio Code</li>
+				<li>[link:https://marketplace.visualstudio.com/items?itemName=ritwickdey.LiveServer Live Server] for Visual Studio Code</li>
+				<li>[link:https://atom.io/packages/atom-live-server Live Server] for Atom</li>
+			</ul>
+
+			<h3>
+		</details>
+
+		<h3>Production</h3>
 
 		<p>
-			The core of three.js is focused on the most important components of a 3D engine. Many other useful components — such as controls, loaders, and post-processing effects — are part of the [link:https://github.com/mrdoob/three.js/tree/dev/examples/jsm examples/jsm] directory. They are referred to as "addons" (previously called "examples"), because while you can use them off the shelf, they're also meant to be remixed and customized. These components are always kept in sync with the core library, whereas similar third-party packages on npm are maintained by different people and may not be up to date.
+			When you're ready to deploy your web application, push the source files to your web hosting provider — no need to build or compile anything. The downside of that tradeoff is that you'll need to be careful to keep the import map updated with any dependencies (and dependencies of dependencies!) that your application requires. If the CDN hosting your dependencies goes down temporarily, your website will stop working too.
 		</p>
 
 		<p>
-			Addons do not need to be <em>installed</em> separately, but do need to be <em>imported</em> separately. If three.js was installed with npm, you can load the [page:OrbitControls] component with:
+			<i><b>IMPORTANT:</b> Import all dependencies from the same version of three.js, and from the same CDN. Mixing files from different sources may cause duplicate code to be included, or even break the application in unexpected ways.</i>
 		</p>
 
-		<code>
-		import { OrbitControls } from 'three/addons/controls/OrbitControls.js';
-
-		const controls = new OrbitControls( camera, renderer.domElement );
-		</code>
+		<h2>Addons</h2>
 
 		<p>
-			If three.js was installed from a CDN, use the same code, but with `three/addons/` in the import map.
+			Out of the box, three.js includes the fundamentals of a 3D engine. Other three.js components — such as controls, loaders, and post-processing effects — are part of the [link:https://github.com/mrdoob/three.js/tree/dev/examples/jsm addons/] directory. Addons do not need to be <i>installed</i> separately, but do need to be <i>imported</i> separately.
 		</p>
 
-		<code>
-		&lt;script async src="https://unpkg.com/[email protected]/dist/es-module-shims.js">&lt;/script>
-
-		&lt;script type="importmap">
-		  {
-		    "imports": {
-		      "three": "https://unpkg.com/three@&lt;version&gt;/build/three.module.js",
-		      "three/addons/": "https://unpkg.com/three@&lt;version&gt;/examples/jsm/"
-		    }
-		  }
-		&lt;/script>
-
-		&lt;script type="module">
-
-		  import * as THREE from 'three';
-		  import { OrbitControls } from 'three/addons/controls/OrbitControls.js';
-
-		  const controls = new OrbitControls( camera, renderer.domElement );
-
-		&lt;/script>
-		</code>
-
 		<p>
-			It's important that all files use the same version. Do not import different addons from different versions, or use addons from a different version than the three.js library itself.
+			The example below shows how to import three.js with the [page:OrbitControls] and [page:GLTFLoader] addons. Where necessary, this will also be mentioned in each addon's documentation or examples.
 		</p>
 
-		<h2>Compatibility</h2>
+		<code>
+import * as THREE from 'three';
+import { OrbitControls } from 'three/addons/controls/OrbitControls.js';
+import { GLTFLoader } from 'three/addons/loaders/GLTFLoader.js';
 
-		<h3>CommonJS imports</h3>
+const controls = new OrbitControls( camera, renderer.domElement );
+const loader = new GLTFLoader();
+		</code>
 
 		<p>
-			While most modern JavaScript bundlers now support ES modules by default, some older build tools might not. In those cases you can likely configure the bundler to understand ES modules: [link:http://browserify.org/ Browserify] just needs the [link:https://github.com/babel/babelify babelify] plugin, for example.
+			Some excellent third-party projects are available for three.js, too. These need to be installed separately — see [link:#manual/introduction/Libraries-and-Plugins Libraries and Plugins].
 		</p>
 
-		<h3>Node.js</h3>
-
-		<p>
-			Because three.js is built for the web, it depends on browser and DOM APIs that don't always exist in Node.js. Some of these issues can be resolved by using shims like [link:https://github.com/stackgl/headless-gl headless-gl], or by replacing components like [page:TextureLoader] with custom alternatives. Other DOM APIs may be deeply intertwined with the code that uses them, and will be harder to work around. We welcome simple and maintainable pull requests to improve Node.js support, but recommend opening an issue to discuss your improvements first.
-		</p>
+		<h2>Next Steps</h2>
 
 		<p>
-			Make sure to add `{ "type": "module" }` to your `package.json` to enable ES6 modules in your node project.
+			You're now ready to [link:#manual/introduction/Creating-a-scene create a scene].
 		</p>
 
 	</body>

+ 1 - 1
docs/manual/en/introduction/Loading-3D-models.html

@@ -30,7 +30,7 @@
 
 	<p>
 		If you're new to running a local server, begin with
-		[link:#manual/introduction/How-to-run-things-locally how to run things locally]
+		[link:#manual/introduction/Installation installation]
 		first. Many common errors viewing 3D models can be avoided by hosting files
 		correctly.
 	</p>

+ 3 - 5
docs/manual/en/introduction/WebGL-compatibility-check.html

@@ -11,14 +11,12 @@
 		<p>
 			Even though this is becoming less and less of a problem, some devices or browsers may still not support WebGL.
 			The following method allows you to check if it is supported and display a message to the user if it is not.
-		</p>
-
-		<p>
-			Add	[link:https://github.com/mrdoob/three.js/blob/master/examples/jsm/capabilities/WebGL.js]
-			to your javascript and run the following before attempting to render anything.
+			Import the WebGL support detection module, and run the following before attempting to render anything.
 		</p>
 
 		<code>
+		import { WebGL } from 'three/addons/capabilities/WebGL.js';
+
 		if ( WebGL.isWebGLAvailable() ) {
 
 			// Initiate function or other initializations here

+ 0 - 169
docs/manual/fr/introduction/How-to-run-things-locally.html

@@ -1,169 +0,0 @@
-<!DOCTYPE html>
-<html lang="fr">
-	<head>
-		<meta charset="utf-8">
-		<base href="../../../" />
-		<script src="page.js"></script>
-		<link type="text/css" rel="stylesheet" href="page.css" />
-	</head>
-	<body>
-		<h1>Exécuter localement ([name])</h1>
-		<p>
-			Si vous n'utilisez que des formes procédurales et que vous ne chargez acune texture, vos pages web sont censées fonctionner
-			directement depuis le système de fichiers, vous n'avez qu'à double-cliquer sur le fichier HTML dans un explorateur de fichier et il
-			devrait apparaître en étant fonctionnel dans le navigateur (vous verrez <em>file:///yourFile.html</em> dans votre barre d'URL).
-		</p>
-
-		<h2>Contenu chargé depuis des fichiers externes</h2>
-		<div>
-			<p>
-				Si vous chargez des modèles ou des textures depuis des fichiers externes, à cause des restrictions de sécurité de la [link:http://en.wikipedia.org/wiki/Same_origin_policy same origin policy] des navigateurs,
-			 	charger depuis un système de fichiers échouera avec une security exception.
-		 	</p>
-
-			<p>
-				Pour résoudre ce problème, exécutez vos fichiers depuis un serveur web local. Cela vous permettra d'accéder à votre page ainsi:
-			</p>
-			
-			<p>
-				<code>http://localhost/yourFile.html</code>
-			</p>
-
-			<p>
-				Même s'il est également possible de changer les paramètres de sécurité du navigateur au lieu de faire tourner un serveur web local,
-				nous ne recommandons pas cette approche. Le faire pourrait exposer votre appareil à des vulnérabilités, si le
-				même navigateur est utilisé pour naviguer d'une manière classique sur le web. Utiliser un serveur local est une pratique standard dans 
-				le développement web, et nous expliquons comment installer et utiliser un serveur local ci-dessous.
-			</p>
-		</div>
-
-
-		<h2>Créer un serveur local</h2>
-		<div>
-			<p>
-				Plusieurs langages de programmation ont un simple serveur HTTP d'intégré. Ils ne sont pas aussi fournis que
-				des serveurs de production comme [link:https://www.apache.org/ Apache] ou [link:https://nginx.org NGINX], néanmoins ils devraient être suffisants pour tester votre
-				application three.js.
-			</p>
-
-			<h3>Plugins pour les éditeurs de codes populaires</h3>
-			<div>
-				<p>Certains éditeurs de code ont des plugins qui créent un simple serveur à la demande.</p>
-				<ul>
-					<li>[link:https://marketplace.visualstudio.com/items?itemName=yandeu.five-server Five Server] pour Visual Studio Code.</li>
-					<li>[link:https://marketplace.visualstudio.com/items?itemName=ritwickdey.LiveServer Live Server] pour Visual Studio Code.</li>
-					<li>[link:https://atom.io/packages/atom-live-server Live Server] pour Atom.</li>
-				</ul>
-			</div>
-
-			<h3>Servez</h3>
-			<div>
-				<p>
-					[link:https://greggman.github.io/servez Servez] est un serveur simple avec une interface graphique.
-				</p>
-			</div>
-
-			<h3>Node.js five-server</h3>
-			<div>
-				<p>Serveur de développement avec capacité de redémarrage en direct. Pour l'installer:</p>
-				<code>
-# Remove live-server (if you have it)
-npm -g rm live-server
-
-# Install five-server
-npm -g i five-server
-
-# Update five-server (from time to time)
-npm -g i five-server@latest
-				</code>
-
-				<p>Pour le lancer (depuis votre dossier local):</p>
-				<code>five-server . -p 8000</code>
-			</div>
-
-			<h3>Node.js http-server</h3>
-			<div>
-				<p>Node.js a un simple serveur de package HTTP. Pour l'installer:</p>
-				<code>npm install http-server -g</code>
-
-				<p>Pour le lancer (depuis votre dossier local):</p>
-				<code>http-server . -p 8000</code>
-			</div>
-
-			<h3>Serveur Python</h3>
-			<div>
-				<p>
-					Si vous avez [link:http://python.org/ Python] d'installé, il devrait suffire pour exécuter
-					cela en ligne de commande (depuis votre dossier de travail):
-				</p>
-				<code>
-//Python 2.x
-python -m SimpleHTTPServer
-
-//Python 3.x
-python -m http.server
-				</code>
-
-				<p>Cela remontera les fichiers du dossier courant au localhost sur le port 8000, par exemple écrivez dans la barre d'URL:</p>
-
-				<code>http://localhost:8000/</code>
-			</div>
-
-			<h3>Serveur Ruby</h3>
-			<div>
-				<p>Si vous avez Ruby d'installé, vous pouvez obtenir le même résultat en exécutant ceci à la place:</p>
-				<code>
-ruby -r webrick -e "s = WEBrick::HTTPServer.new(:Port => 8000, :DocumentRoot => Dir.pwd); trap('INT') { s.shutdown }; s.start"
-				</code>
-			</div>
-
-			<h3>Serveur PHP</h3>
-			<div>
-				<p>PHP a également un serveur web intégré, depuis la 5.4.0:</p>
-				<code>php -S localhost:8000</code>
-			</div>
-
-			<h3>Lighttpd</h3>
-			<div>
-				<p>
-					Lighttpd est un serveur web très léger pouvant servir pour des usages variés. Nous verrons comment l'installer sur OSX avec
-					HomeBrew ci-dessous. Contrairement aux autres serveurs cités ici, lighttpd est un serveur de production complet
-					et prêt à l'utilisation.
-				</p>
-
-				<ol>
-					<li>
-						L'installer via homebrew
-						<code>brew install lighttpd</code>
-					</li>
-					<li>
-						Créez un fichier de configuration nommé lighttpd.conf dans le dossier où vous souhaitez exécuter votre
-						serveur web. Vous trouverez un exemple ici [link:http://redmine.lighttpd.net/projects/lighttpd/wiki/TutorialConfiguration here].
-					 </li>
-					<li>
-						Dans le fichier de configuration, changez le server.document-root pour le dossier d'où vous souhaitez remonter les fichiers.
-					</li>
-					<li>
-						Lancez-le avec
-						<code>lighttpd -f lighttpd.conf</code>
-					</li>
-					<li>
-						Rendez-vous sur http://localhost:3000/ et vous-y retrouverez les fichiers statiques du dossier
-						choisi.
-					</li>
-				</ol>
-			</div>
-			<h3>IIS</h3>
-			<div>
-				<p>Si vous utilisez Microsoft IIS comme serveur web. Veuillez ajouter un type de paramètres MIME concernant l'extension .fbx avant de charger.</p>
-				<code>File name extension: fbx        MIME Type: text/plain</code>
-				<p>Par défaut, IIS bloque le téléchargementt des fichiers .fbx, .obj. Vous devez configurer IIS pour autoriser le téléchargement de ce genre de fichiers.</p>
-			</div>
-			<p>
-				D'autres alternatives simples sont [link:http://stackoverflow.com/q/12905426/24874 présentées ici]
-				sur Stack Overflow.
-			</p>
-		</div>
-
-	</body>
-</html>

+ 0 - 167
docs/manual/it/introduction/How-to-run-things-locally.html

@@ -1,167 +0,0 @@
-<!DOCTYPE html>
-<html lang="it">
-	<head>
-		<meta charset="utf-8">
-		<base href="../../../" />
-		<script src="page.js"></script>
-		<link type="text/css" rel="stylesheet" href="page.css" />
-	</head>
-	<body>
-		<h1>Esecuzione in locale ([name])</h1>
-    <p>
-      Se si usano solo geometrie procedurali e non si caricano texture, le pagine web dovrebbero funzionare direttamente
-      dal file system, basta fare doppio click sul file HTML in un file manager e la pagina dovrebbe apparire funzionante nel browser
-      (si vedrà <em>file:///yourFile.html</em> nella barra degli indirizzi del browser).
-		</p>
-
-		<h2>Contenuto caricato da file esterni</h2>
-		<div>
-       <p>
-				Se si caricano modelli o texture da file esterni, a causa delle restrizioni di sicurezza del [link:http://en.wikipedia.org/wiki/Same_origin_policy same origin policy] del browser,
-        il caricamento da un file system fallirà con un'eccezione di sicurezza.
-		 	</p>
-
-      <p>
-				Per risolvere questo problema, conviene eseguire i file da un server locale. Questo permette di accedere alla pagina come:
-			</p>
-			
-			<p>
-				<code>http://localhost/yourFile.html</code>
-			</p>
-
-      <p>
-        Anche se è possibile cambiare le impostazioni di sicurezza del browser invece di lanciare un server in locale,
-        non lo raccomandiamo. Utilizzando questo approccio si potrebbe esporre il proprio dispositivo a molte vulnerabilità soprattutto se
-        lo stesso browser viene utilizzato per la regolare navigazione sul web. Usare un server locale è una pratica standard nello sviluppo
-        web. Qui sotto, spieghiamo come si installa e utilizza un server locale.
-			</p>
-		</div>
-
-
-		<h2>Eseguire un server locale</h2>
-		<div>
-      <p>
-				Molti linguaggi di programmazione hanno semplici server HTTP integrati. Non sono completi come i server di produzione 
-        come ad esempio [link:https://www.apache.org/ Apache] o [link:https://nginx.org NGINX], ma sono sufficienti per testare la tua applicazione three.js. 
-			</p>
-
-			<h3>Plugin per i principali editor</h3>
-			<div>
-				<p>Alcuni editor hanno plugin che genereranno un semplice server su richiesta.</p>
-				<ul>
-					<li>[link:https://marketplace.visualstudio.com/items?itemName=yandeu.five-server Five Server] per Visual Studio Code.</li>
-					<li>[link:https://marketplace.visualstudio.com/items?itemName=ritwickdey.LiveServer Live Server] per Visual Studio Code.</li>
-					<li>[link:https://atom.io/packages/atom-live-server Live Server] per Atom.</li>
-				</ul>
-			</div>
-
-			<h3>Servez</h3>
-			<div>
-				<p>
-					[link:https://greggman.github.io/servez Servez] è un semplice server con GUI.
-				</p>
-			</div>
-
-			<h3>Node.js five-server</h3>
-			<div>
-				<p>Server di sviluppo con un reload in tempo reale. Installazione:</p>
-				<code>
-# Eliminare live-server (se è presente)
-npm -g rm live-server
-
-# Installare five-server
-npm -g i five-server
-
-# Aggiornare five-server (di volta in volta)
-npm -g i five-server@latest
-				</code>
-
-				<p>Esecuzione (dalla tua cartella locale):</p>
-				<code>five-server . -p 8000</code>
-			</div>
-
-			<h3>Node.js http-server</h3>
-			<div>
-				<p>Node.js ha un semplice server HTTP. Installazione:</p>
-				<code>npm install http-server -g</code>
-
-				<p>Esecuzione (dalla tua cartella locale):</p>
-				<code>http-server . -p 8000</code>
-			</div>
-
-			<h3>Python server</h3>
-			<div>
-        <p>
-					Se hai installato [link:http://python.org/ Python], dovrebbe essere sufficiente eseguire
-          i seguenti comandi da terminale (dalla cartella di lavoro):
-				</p>
-				<code>
-//Python 2.x
-python -m SimpleHTTPServer
-
-//Python 3.x
-python -m http.server
-				</code>
-
-				<p>Questo servirà i file dalla cartella corrente a localhost sotto la porta 8000, cioè nella barra degli indirizzi digita:</p>
-
-				<code>http://localhost:8000/</code>
-			</div>
-
-			<h3>Ruby server</h3>
-			<div>
-				<p>Se hai installato Ruby, puoi avere lo stesso risultato eseguendo il seguente comando:</p>
-				<code>
-ruby -r webrick -e "s = WEBrick::HTTPServer.new(:Port => 8000, :DocumentRoot => Dir.pwd); trap('INT') { s.shutdown }; s.start"
-				</code>
-			</div>
-
-			<h3>PHP server</h3>
-			<div>
-				<p>Anche PHP ha un server web integrato, a partire da php 5.4.0:</p>
-				<code>php -S localhost:8000</code>
-			</div>
-
-			<h3>Lighttpd</h3>
-			<div>
-        <p>
-					Lighttpd è un server web generico molto leggero. Tratteremo l'installazione su OSX con HomeBrew.
-          Diversamente dagli altri server di cui abbiamo discusso qui, lighttpd è un server di produzione completo
-          pronto per la produzione.
-				</p>
-
-				<ol>
-					<li>
-						Installazione tramite homebrew
-						<code>brew install lighttpd</code>
-					</li>
-          <li>
-            Creare un file di configurazione chiamato lighttpd.conf nella cartella in cui vuoi eseguire il server.
-            [link:http://redmine.lighttpd.net/projects/lighttpd/wiki/TutorialConfiguration Qui] trovi un esempio.
-          </li>
-          <li>
-						Nel file di configurazione deve essere cambiato il valore di server.document-root con la directory da cui vuoi servire i file.
-					</li>
-					<li>
-						Avvialo con
-						<code>lighttpd -f lighttpd.conf</code>
-					</li>
-					<li>
-						Inserisci l'indirizzo http://localhost:3000/ nella barra degli indirizzi del browser, questo servirà file statici 
-            dalla cartella che hai scelto.
-					</li>
-				</ol>
-			</div>
-			<h3>IIS</h3>
-			<div>
-				<p>Se usi Microsoft IIS come web server. Per favore aggiungi le impostazioni del MIME type relative all'estensione .fbx prima del caricamento.</p>
-				<code>File name extension: fbx        MIME Type: text/plain</code>
-				<p>Per impostazione predefinita IIS blocca i download di file .fbx, .obj. È necessario configurare IIS per abilitare il download di questo tipo di file</p>
-			</div>
-			<p>
-        Altre semplici alternative sono [link:http://stackoverflow.com/q/12905426/24874 trattate qui] su Stack Overflow.
-			</p>
-		</div>
-
-	</body>
-</html>

+ 1 - 1
docs/manual/it/introduction/Loading-3D-models.html

@@ -27,7 +27,7 @@
 
 	<p>
 		Se siete alle prime armi con la gestione di un server locale,
-    iniziate prima di tutto a capire [link:#manual/introduction/How-to-run-things-locally come gestire le cose a livello locale].
+    iniziate prima di tutto a capire [link:#manual/introduction/Installation installation].
     Molti errori comuni nella visualizzazione dei modelli 3D possono essere evitati gestendo correttamente l'hosting dei file.
 	</p>
 

+ 0 - 149
docs/manual/ja/introduction/How-to-run-things-locally.html

@@ -1,149 +0,0 @@
-<!DOCTYPE html>
-<html lang="ja">
-
-<head>
-    <meta charset="utf-8">
-    <base href="../../../" />
-    <script src="page.js"></script>
-    <link type="text/css" rel="stylesheet" href="page.css" />
-</head>
-
-<body>
-    <h1>[name]</h1>
-    <p>
-        テクスチャを呼び出さずに、ジオメトリを使うだけならウェブページをファイルシステムからそのまま動かすことができます。ファイルマネージャのHTMLファイルをダブルクリックすると、ブラウザで動作するはずです。(ブラウザのアドレスバーには<em>file:///yourFile.html</em>と表示されているでしょう)
-    </p>
-
-    <h2>外部のファイルからコンテンツを読み込む</h2>
-    <div>
-        <p>
-            外部ファイルからテクスチャやモジュールを読み込む場合、ブラウザのセキュリティ制限によって、ファイルシステムからの読み込みは失敗します。
-        </p>
-
-        <p>これを解決するには2つの方法があります。</p>
-
-        <ol>
-            <li>
-                ブラウザのローカルファイルに対するセキュリティ設定を変更することです。これによって、<code>file:///yourFile.html</code>といったローカルのファイルにアクセスできるようになります。
-            </li>
-            <li>
-                もうひとつは、ローカルのサーバからファイルを起動することです。こうすることで、<code>http://localhost/yourFile.html</code>にアクセスできるようになります。
-            </li>
-        </ol>
-
-        <p>
-            1つ目の方法を使う場合、いつも使用しているブラウザを使用すると、自ら脆弱性を露呈させかねないことに注意してください。念のため、ローカル開発専用のブラウザプロファイル/ショートカットを分けて作成しておいた方が良いかもしれません。それぞれのオプションを順番に紹介します。
-        </p>
-    </div>
-
-
-    <h2>ローカルでサーバを動かす</h2>
-    <div>
-        <p>
-            ほとんどのプログラム言語は組み込みの簡単なHTTPサーバが使えます。こういった組み込みのサーバは、ApacheやNginxなどの本番用に使用されるサーバと比べると機能が少ないですが、three.jsを試してみるには十分な機能があります
-        </p>
-
-        <h3>コードエディタのプラグイン</h3>
-        <div>
-            <p>コードエディタの中には、オンデマンドでシンプルなサーバを起動するプラグインがありものがあります</p>
-            <ul>
-                <li>Visual Studio Codeの[link:https://marketplace.visualstudio.com/items?itemName=ritwickdey.LiveServer Live Server]</li>
-                <li>Atomの[link:https://atom.io/packages/atom-live-server Live Server]</li>
-            </ul>
-        </div>
-
-        <h3>Servez</h3>
-        <div>
-            <p>
-                [link:https://greggman.github.io/servez Servez]はGUI で操作できるシンプルなサーバです。
-            </p>
-        </div>
-
-        <h3>Node.js http-server</h3>
-        <div>
-            <p>Node.jsにはシンプルなHTTPサーバーパッケージがあります。インストールするには以下のコマンドを実行してください。</p>
-            <code>npm install http-server -g</code>
-
-            <p>ローカル環境で実行するには以下のようにしてください</p>
-            <code>http-server . -p 8000</code>
-        </div>
-
-        <h3>Python server</h3>
-        <div>
-            <p>
-                [link:http://python.org/ Python]がインストールされている場合、作業ディレクトリで以下のようにコマンドライン実行すれば、サーバを動かすことができます。
-            </p>
-            <code>
-//Python 2.x
-python -m SimpleHTTPServer
-
-//Python 3.x
-python -m http.server
-				</code>
-
-            <p>
-                このようにすることで、ローカルホストのカレントディレクトリから8000番ポートでファイルが提供されます。提供されるファイルを見るためには、ブラウザのアドレスバーに以下のように入力してください。
-            </p>
-
-            <code>http://localhost:8000/</code>
-        </div>
-
-        <h3>Ruby server</h3>
-        <div>
-            <p>Rubyがインストールされている環境の場合、代わりに以下のコマンドを実行することでサーバを動かすことができます。</p>
-            <code>
-ruby -r webrick -e "s = WEBrick::HTTPServer.new(:Port => 8000, :DocumentRoot => Dir.pwd); trap('INT') { s.shutdown }; s.start"
-				</code>
-        </div>
-
-        <h3>PHP server</h3>
-        <div>
-            <p>PHPにも組み込みのwebサーバがあるので、phpの5.4.0で以下のように実行してみてください</p>
-            <code>php -S localhost:8000</code>
-        </div>
-
-        <h3>Lighttpd</h3>
-        <div>
-            <p>
-                Lighttpd は非常に軽量な汎用ウェブサーバです。ここではOSXにHomeBrewでインストールする方法を説明します。ここで説明した他のサーバとは異なり、lighttpd は本格的な本番環境に対応したサーバです。
-            </p>
-
-            <ol>
-                <li>
-                    homebrewでLighttpdをインストールする
-                    <code>brew install lighttpd</code>
-                </li>
-                <li>
-                    ウェブサーバを動作させたいディレクトリにlighttpd.confという設定ファイルを作成します。 設定ファイルのサンプルはこちらにあります。: [link:http://redmine.lighttpd.net/projects/lighttpd/wiki/TutorialConfiguration TutorialConfiguration]
-                </li>
-                <li>
-                    設定ファイルでserver.document-rootを提供したいファイルが置いてあるディレクトリに変更してください
-                </li>
-                <li>
-                    Lighttpdは以下のコマンドで実行できます。
-                    <code>lighttpd -f lighttpd.conf</code>
-                </li>
-                <li>
-                    http://localhost:3000/ に移動すると、選択したディレクトリから静的ファイルを提供します。
-                </li>
-            </ol>
-        </div>
-        <h3>IIS</h3>
-        <div>
-            <p>
-                WebサーバにMicrosoft IISを使用している場合ロードする前に.fbx拡張子に関するMIMEタイプの設定を追加してください。
-            </p>
-            <code>File name extension: fbx        MIME Type: text/plain</code>
-            <p>
-                デフォルトではIISは.fbxや.objのファイルをダウンロードするのをブロックします。そのため、IISがそういったファイル(.fbxなど)をダウンロードできるように設定を変更する必要があります。
-
-            </p>
-        </div>
-        <p>
-            他のシンプルな方法はStack Overflowで議論されています: [link:http://stackoverflow.com/q/12905426/24874 Simple way]
-        </p>
-    </div>
-
-</body>
-
-</html>

+ 1 - 1
docs/manual/ja/introduction/Loading-3D-models.html

@@ -28,7 +28,7 @@
 
 	<p>
 		もしthree.jsをローカルサーバで動かすのが初めてなら、
-		[link:#manual/introduction/How-to-run-things-locally how to run things locally]を見てみてください。
+		[link:#manual/introduction/Installation installation]を見てみてください。
 		3Dモデルを表示する際の多くの一般的なエラーはファイルを正しく配置することで防ぐことができます。
 	</p>
 

+ 0 - 149
docs/manual/ko/introduction/How-to-run-things-locally.html

@@ -1,149 +0,0 @@
-<!DOCTYPE html>
-<html lang="ko">
-
-<head>
-    <meta charset="utf-8">
-    <base href="../../../" />
-    <script src="page.js"></script>
-    <link type="text/css" rel="stylesheet" href="page.css" />
-</head>
-
-<body>
-    <h1>로컬 환경에서 구동 방법([name])</h1>
-    <p>
-        만약 procedural geometries 만을 사용하고 다른 텍스쳐를 불러오지 않았다면, 웹페이지는 파일 매니저에서 HTML파일을 더블클릭하는 즉시 작업을 시작할 것이고,
-        브라우저에서 바로 작업되는 화면이 나타날 것입니다. (주소창에 <em>file:///yourFile.html</em> 를 치면 확인이 될 것입니다.).
-    </p>
-
-    <h2>외부 파일에서 컨텐츠 불러오기</h2>
-    <div>
-        <p>
-            외부 파일에서 모델이나 텍스쳐를 불러올 경우, 브라우저의' [link:http://en.wikipedia.org/wiki/Same_origin_policy same origin policy]
-            보안 제한때문에 파일 불러오기가 실패가 될 것입니다.
-        </p>
-
-        <p>이 문제의 해결법은 두 가지가 있습니다.</p>
-
-        <ol>
-            <li>
-                브라우저에서 로컬 파일의 보안설정을 변경합니다. 이를 통해<code>file:///yourFile.html</code>로 들어가 확인할 수 있을 것입니다.
-            </li>
-            <li>
-                파일을 로컬 웹 서버에서 돌리는 방법입니다. <code>http://localhost/yourFile.html</code>로 들어가 확인할 수 있을 것입니다.
-            </li>
-        </ol>
-
-        <p>
-            1번 방법을 쓸 때, 일반 웹서핑을 같은 방식으로 쓰게되면 보안적으로 취약해지는 점을 인지해야 합니다. 안전한 개발을 위해
-            각각의 브라우저 프로필, 바로가기를 만드는 것도 좋습니다. 차례대로 방법을 알아봅시다.
-        </p>
-    </div>
-
-
-    <h2>로컬 서버에서 실행</h2>
-    <div>
-        <p>
-            많은 프로그래밍 언어는 기본적으로 간단한 HTTP 서버가 설치되어 있습니다. [link:https://www.apache.org/ Apache]나 [link:https://nginx.org NGINX]같은 프로덕션용 정도로 갖추어져 있지는 않지만, three.js를 테스트해보기에는 충분합니다.
-        </p>
-
-        <h3>유명 코드 에디터 관련 플러그인</h3>
-        <div>
-            <p>몇몇 코드 에디터들은 간단한 서버를 필요할 때 구축할 수 있게 플러그인을 마련해 두고 있습니다.</p>
-            <ul>
-                <li>Visual Studio Code의 [link:https://marketplace.visualstudio.com/items?itemName=ritwickdey.LiveServer Live Server]
-                    .</li>
-                <li>Atom의 [link:https://atom.io/packages/atom-live-server Live Server].</li>
-            </ul>
-        </div>
-
-        <h3>Servez</h3>
-        <div>
-            <p>
-                [link:https://greggman.github.io/servez Servez]는 GUI 환경의 간단한 서버입니다.
-            </p>
-        </div>
-
-        <h3>Node.js http-server</h3>
-        <div>
-            <p>Node.js에는 간단한 HTTP 서버 패키지가 있습니다. 설치 방법:</p>
-            <code>npm install http-server -g</code>
-
-            <p>실행 (로컬 저장소에서):</p>
-            <code>http-server . -p 8000</code>
-        </div>
-
-        <h3>Python 서버</h3>
-        <div>
-            <p>
-                [link:http://python.org/ Python]이 설치되어 있다면, 커맨드라인으로 충분히 실행할 수 있습니다. (작업 디렉토리 내에서):
-            </p>
-            <code>
-//Python 2.x
-python -m SimpleHTTPServer
-
-//Python 3.x
-python -m http.server
-				</code>
-
-            <p>이 코드는 현재 디렉토리의 파일들을 localhost 8000번 포트로 내보내 줄 것입니다. 주소 예시는 다음과 같습니다.
-                </p>
-
-            <code>http://localhost:8000/</code>
-        </div>
-
-        <h3>Ruby 서버</h3>
-        <div>
-            <p>Ruby가 설치되어 있다면, 아래 코드를 사용하면 같은 결과를 확인할 수 있습니다.</p>
-            <code>
-ruby -r webrick -e "s = WEBrick::HTTPServer.new(:Port => 8000, :DocumentRoot => Dir.pwd); trap('INT') { s.shutdown }; s.start"
-				</code>
-        </div>
-
-        <h3>PHP 서버</h3>
-        <div>
-            <p>PHP도 내장된 웹서버가 있어, php 5.4.0부터 다음과 같이 활용 가능합니다:</p>
-            <code>php -S localhost:8000</code>
-        </div>
-
-        <h3>Lighttpd</h3>
-        <div>
-            <p>
-                Lighttpd는 일반적인 목적의 아주 가벼운 웹서버입니다. 여기서에는 Homebrew를 통해 OSX에 설치하는 예를 소개해 보겠습니다.
-                다른 서버들과는 달리, lighttpd 프로덕션 서버로 사용될 모든 것이 갖추어져 있습니다.
-            </p>
-
-            <ol>
-                <li>
-                    homebrew를 통해 설치합니다.
-                    <code>brew install lighttpd</code>
-                </li>
-                <li>
-                    웹서버에서 실행하고자 하는 디렉토리에 lighttpd.conf라는 설정파일을 만듭니다.
-                    예제는 여기([link:http://redmine.lighttpd.net/projects/lighttpd/wiki/TutorialConfiguration link])에서 확인할 수 있습니다.
-                </li>
-                <li>
-                    설정 파일에서, server.document-root를 서버로 쓰고자 하는 디렉토리로 설정합니다.
-                </li>
-                <li>
-                    다음과 같이 실행합니다.
-                    <code>lighttpd -f lighttpd.conf</code>
-                </li>
-                <li>
-                    http://localhost:3000/ 로 들어가면 선택한 디렉토리의 파일들을 보여줄 것입니다.
-                </li>
-            </ol>
-        </div>
-        <h3>IIS</h3>
-        <div>
-            <p>마이크로소프트 IIS를 웹서버로 사용한다면, 실행하기에 앞서 .fbx 확장자와 관련된 MIME 타입 설정을 추가해야 합니다.</p>
-            <code>File name extension: fbx        MIME Type: text/plain</code>
-            <p>기본적으로 IIS는 .fbx, .obj 파일의 다운로드를 막아 놓았습니다. IIS에서 이러한 파일들이 다운로드 될 수 있도록 설정해야 합니다.</p>
-        </div>
-        <p>
-            다른 간단한 방법으로는 Stack Overflow에서 논의된 내용([link:http://stackoverflow.com/q/12905426/24874 link])을 확인해 보세요.
-        </p>
-    </div>
-
-</body>
-
-</html>

+ 1 - 1
docs/manual/ko/introduction/Loading-3D-models.html

@@ -27,7 +27,7 @@
 
 	<p>
 		로컬 서버를 돌리는 것이 처음이라면,
-		[link:#manual/introduction/How-to-run-things-locally how to run things locally]
+		[link:#manual/introduction/Installation installation]
 		를 먼저 확인하세요. 3D 모델의 대부분의 에러는 파일을 알맞게 호이스팅하는 것으로 해결할 수 있습니다.
 	</p>
 

+ 0 - 186
docs/manual/pt-br/introduction/How-to-run-things-locally.html

@@ -1,186 +0,0 @@
-<!DOCTYPE html>
-<html lang="pt-br">
-	<head>
-		<meta charset="utf-8">
-		<base href="../../../" />
-		<script src="page.js"></script>
-		<link type="text/css" rel="stylesheet" href="page.css" />
-	</head>
-	<body>
-		<h1>Como executar localmente</h1>
-
-		<p>
-			Se você usar apenas geometrias procedurais e não carregar nenhuma textura, 
-			as páginas web devem funcionar direto do sistema de arquivos, bastando clicar duas vezes 
-			no arquivo HTML em um gerenciador de arquivos para então funcionar no navegador (você verá <em>file:///yourFile.html</em> na barra de endereço).
-		</p>
-
-		<h2>Conteúdo carregado de arquivos externos</h2>
-
-		<div>
-			<p>
-				Se você carregar modelos ou texturas de arquivos externos, devido a [link:http://en.wikipedia.org/wiki/Same_origin_policy same origin policy] 
-				dos navegadores, o carregamento de um sistema de arquivos falhará com uma exceção de segurança.
-			</p>
-
-			<p>
-				Para resolver isso, execute os arquivos de um servidor web local. Isso permitirá acessar a página por:
-			</p>
-
-			<p>
-				<code>http://localhost/yourFile.html</code>
-			</p>
-
-			<p>
-				Embora também seja possível alterar as configurações de segurança do navegador ao invés de executar 
-				um servidor local, não recomendamos essa abordagem. Isso pode abrir seu dispositivo para vulnerabilidades, 
-				se o mesmo navegador é usado para navegação regular na web. O uso de um servidor local é uma prática padrão 
-				em desenvolvimento web e explicamos abaixo como instalar e usar um servidor local.
-			</p>
-		</div>
-
-
-		<h2>Rodando um servidor local</h2>
-		<div>
-			<p>
-				Muitas linguagens de programação têm servidores HTTP simples embutidos. Eles não são tão 
-				completos quanto servidores de produção como o [link:https://www.apache.org/ Apache] ou o 
-				[link:https://nginx.org NGINX], no entanto devem ser suficientes para testar sua aplicação three.js.
-			</p>
-
-			<h3>Plugins para editores populares de código</h3>
-			<div>
-				<p>
-					Alguns editores de código tem plugins que irão rodar um servidor simples.
-				</p>
-				<ul>
-					<li>[link:https://marketplace.visualstudio.com/items?itemName=yandeu.five-server Five Server] para Visual Studio Code.</li>
-					<li>[link:https://marketplace.visualstudio.com/items?itemName=ritwickdey.LiveServer Live Server] para Visual Studio Code.</li>
-					<li>[link:https://atom.io/packages/atom-live-server Live Server] para Atom.</li>
-				</ul>
-			</div>
-
-			<h3>Servez</h3>
-			<div>
-				<p>
-					[link:https://greggman.github.io/servez Servez] é um servidor simples com uma interface gráfica.
-				</p>
-			</div>
-
-			<h3>Node.js five-server</h3>
-			<div>
-				<p>
-					Servidor de desenvolvimento com live reload. Para instalar:
-				</p>
-				<code>
-# Remove live-server (if you have it)
-npm -g rm live-server
-
-# Install five-server
-npm -g i five-server
-
-# Update five-server (from time to time)
-npm -g i five-server@latest
-				</code>
-
-				<p>Para executar (do seu diretório local):</p>
-				<code>five-server . -p 8000</code>
-			</div>
-
-			<h3>Node.js http-server</h3>
-			<div>
-				<p>
-					O Node.js tem um pacote simples de um servidor HTTP. Para instalar:
-				</p>
-				<code>npm install http-server -g</code>
-
-				<p>Para executar (do seu diretório local):</p>
-				<code>http-server . -p 8000</code>
-			</div>
-
-			<h3>Servidor Python</h3>
-			<div>
-				<p>
-					Se você tem [link:http://python.org/ Python] instalado, deve ser suficiente para 
-					executar esse comando (do seu diretório de trabalho):
-				</p>
-				<code>
-//Python 2.x
-python -m SimpleHTTPServer
-			
-//Python 3.x
-python -m http.server
-				</code>
-
-				<p>Isso vai servir os arquivos do diretório atual para localhost na porta 8000, 
-					isto é, na barra de endereço digite:
-				</p>
-
-				<code>http://localhost:8000/</code>
-			</div>
-
-			<h3>Servidor Ruby</h3>
-			<div>
-				<p>
-					Se você tem Ruby instalado, você poder ter o mesmo resultado executando:
-				</p>
-				<code>
-					ruby -r webrick -e "s = WEBrick::HTTPServer.new(:Port => 8000, :DocumentRoot => Dir.pwd); trap('INT') { s.shutdown }; s.start"
-				</code>
-			</div>
-
-			<h3>Servidor PHP</h3>
-			<div>
-				<p>PHP também tem um servidor web embutido, começando com php 5.4.0:</p>
-				<code>php -S localhost:8000</code>
-			</div>
-
-			<h3>Lighttpd</h3>
-			<div>
-				<p>
-					Lighttpd é um servidor web de uso geral muito leve. Abordaremos a instalação no OSX 
-					com HomeBrew aqui. Ao contrário dos outros servidores discutidos, Lighttpd é um servidor 
-					completo de produção.
-				</p>
-
-				<ol>
-					<li>
-						Instale via homebrew
-						<code>brew install lighttpd</code>
-					</li>
-					<li>
-						Crie um arquivo de configuração chamado lighttpd.conf no diretório onde você irá executar 
-						o servidor web. Um exemplo está [link:http://redmine.lighttpd.net/projects/lighttpd/wiki/TutorialConfiguration aqui].
-					 </li>
-					<li>
-						No arquivo conf, mude o server.document-root para o diretório do qual você quer servir os arquivos.
-					</li>
-					<li>
-						Comece com
-						<code>lighttpd -f lighttpd.conf</code>
-					</li>
-					<li>
-						Navegue até http://localhost:8000/ e ele servirá os arquivos estáticos do diretório que você 
-						escolheu.
-					</li>
-				</ol>
-			</div>
-			<h3>IIS</h3>
-			<div>
-				<p>
-					Se você estiver usando o Microsoft IIS como servidor web. Por favor adicione
-					 configurações de tipo MIME em relação à extensão .fbx antes de carregar.
-				</p>
-				<code>File name extension: fbx        MIME Type: text/plain</code>
-				<p>
-					Por padrão, o IIS bloqueia downloads de arquivos .fbx e .obj. Você tem que 
-					configurar o IIS para habilitar que esse tipo de arquivo possa ser baixado.
-				</p>
-			</div>
-			<p>
-				Outras alternativas simples são [link:http://stackoverflow.com/q/12905426/24874 discutidas aqui] no StackOverflow.
-			</p>
-		</div>
-
-	</body>
-</html>

+ 1 - 1
docs/manual/pt-br/introduction/Loading-3D-models.html

@@ -29,7 +29,7 @@
 
 	<p>
 		Se você é iniciante na execução de um servidor local, comece com
-		[link:#manual/introduction/How-to-run-things-locally Como executar localmente]
+		[link:#manual/introduction/Installation installation]
 		primeiro. Muitos erros comuns de visualização de modelos 3D podem ser evitados hospedando arquivos
 		corretamente.
 	</p>

+ 0 - 184
docs/manual/ru/introduction/How-to-run-things-locally.html

@@ -1,184 +0,0 @@
-<!DOCTYPE html>
-<html lang="ru">
-<head>
-	<meta charset="utf-8">
-	<base href="../../../"/>
-	<script src="page.js"></script>
-	<link type="text/css" rel="stylesheet" href="page.css"/>
-</head>
-<body>
-<h1>Локальная разработка ([name])</h1>
-<p>
-	Если вы используете только процедурную геометрию и не загружаете никаких текстур, веб-страницы должны работать
-	прямо из файловой системы, просто дважды щелкните по HTML-файлу в файловом менеджере, и он
-	должен появиться в браузере (вы увидите <em>file:///вашФайл.html </em> в адресной строке).
-</p>
-
-<h2>Контент загружен из внешних файлов</h2>
-<div>
-	<p>
-		Если вы загружаете модели или текстуры из внешних файлов, из-за того, что браузеры
-		[link:http://en.wikipedia.org/wiki/Same_origin_policy same origin policy](политика одинакового происхождения)
-		ограничения безопасности, загрузка из файловой системы завершится ошибкой с исключением безопасности.
-	</p>
-
-	<p>
-		Чтобы решить эту проблему, запустите файлы с локального веб-сервера. Это позволит вам получить доступ к вашей
-		странице как:
-	</p>
-
-	<p>
-		<code>http://localhost/yourFile.html</code>
-	</p>
-
-	<p>
-		Хотя также можно изменить настройки безопасности браузера вместо запуска локального сервера,
-		мы не рекомендуем такой подход. Это может открыть ваше устройство для уязвимостей, если
-		тот же браузер используется для обычного веб-серфинга. Использование локального сервера является стандартной
-		практикой в
-		веб-разработки, и ниже мы объясним, как установить и использовать локальный сервер.
-	</p>
-</div>
-
-
-<h2>Запуск локального сервера</h2>
-<div>
-	<p>
-		Многие языки программирования имеют встроенные простые HTTP-серверы. Они не так полнофункциональны, как
-		рабочие серверы, такие как [link:https://www.apache.org/ Apache] или [link:https://nginx.org NGINX], однако их
-		должно быть достаточно для тестирования вашего
-		three.js приложение.
-	</p>
-
-	<h3>Плагины для популярных редакторов кода</h3>
-	<div>
-		<p>В некоторых редакторах кода есть плагины, которые по запросу создают простой сервер.</p>
-		<ul>
-			<li>[link:https://marketplace.visualstudio.com/items?itemName=yandeu.five-server Five Server] для Visual
-				Studio Code.
-			</li>
-			<li>[link:https://marketplace.visualstudio.com/items?itemName=ritwickdey.LiveServer Live Server] для Visual
-				Studio Code.
-			</li>
-			<li>[link:https://atom.io/packages/atom-live-server Live Server] для Atom.</li>
-			<li>для ide от jetbrains уже все из коробки (как всегда)</li>
-		</ul>
-	</div>
-
-	<h3>Servez</h3>
-	<div>
-		<p>
-			[link:https://greggman.github.io/servez Servez] это простой сервер с графическим интерфейсом.
-		</p>
-	</div>
-
-	<h3>Node.js five-server</h3>
-	<div>
-		<p>Сервер разработки с возможностью горячей перезагрузки. Установка:</p>
-		<code>
-
-			# Удалите live-server (если он у вас есть)
-			npm -g rm live-server
-
-			# Установите five-server
-			npm -g i five-server
-
-			# Обновление five-server (иногда)
-			npm -g i five-server@latest
-		</code>
-
-		<p>Для запуска (из вашей локальной директории):</p>
-		<code>five-server . -p 8000</code>
-	</div>
-
-	<h3>Node.js http-server</h3>
-	<div>
-		<p>Node.js имеет простой пакет HTTP-сервера. Установка:</p>
-		<code>npm install http-server -g</code>
-
-		<p>Для запуска (из вашей локальной директории):</p>
-		<code>http-server . -p 8000</code>
-	</div>
-
-	<h3>Python сервер</h3>
-	<div>
-		<p>
-			Если у вас установлен [link:http://python.org/ Python], этого должно быть достаточно для запуска
-			из командной строки (из вашей локальной директории):
-		</p>
-		<code>
-			//Python 2.x
-			python -m SimpleHTTPServer
-
-			//Python 3.x
-			python -m http.server
-		</code>
-
-		<p>Это поднимет сервер для файлов из текущего каталога на localhost на порте 8000, т.е. в адресной строке
-			введите:</p>
-
-		<code>http://localhost:8000/</code>
-	</div>
-
-	<h3>Ruby сервер</h3>
-	<div>
-		<p>Если у вас установлен Ruby, вы можете получить тот же результат, выполнив:</p>
-		<code>
-			ruby -r webrick -e "s = WEBrick::HTTPServer.new(:Port => 8000, :DocumentRoot => Dir.pwd); trap('INT') { s.shutdown }; s.start"
-		</code>
-	</div>
-
-	<h3>PHP сервер</h3>
-	<div>
-		<p>PHP также имеет встроенный веб-сервер, начиная с php 5.4.0:</p>
-		<code>php -S localhost:8000</code>
-	</div>
-
-	<h3>Lighttpd</h3>
-	<div>
-		<p>
-			Lighttpd - это очень легкий веб-сервер общего назначения. Мы рассмотрим установку его на OSX с помощью
-			HomeBrew. В отличие от других серверов, обсуждаемых здесь, lighttpd является полноценным прод. сервером.
-		</p>
-
-		<ol>
-			<li>
-				Установка с помощью homebrew
-				<code>brew install lighttpd</code>
-			</li>
-			<li>
-				Создайте конфигурационный файл с именем lighttpd.conf в каталоге, в котором вы хотите запустить
-				ваш веб-сервер. Пример [link:http://redmine.lighttpd.net/projects/lighttpd/wiki/TutorialConfiguration
-				here].
-			</li>
-			<li>
-				В файле conf измените корневой каталог server.document на каталог, из которого вы хотите обслуживать
-				файлы.
-			</li>
-			<li>
-				Запуск
-				<code>lighttpd -f lighttpd.conf</code>
-			</li>
-			<li>
-				Перейдите в http://localhost:3000/ и он будет обслуживать статические файлы из каталога, который вы
-				выбрали.
-			</li>
-		</ol>
-	</div>
-	<h3>IIS</h3>
-	<div>
-		<p>Если вы используете Microsoft IIS в качестве веб-сервера. Пожалуйста, добавьте настройки типа MIME для
-			расширения .fbx перед загрузкой.</p>
-		<code>File name extension: fbx MIME Type: text/plain</code>
-		<p>По умолчанию IIS блокирует загрузку файлов .fbx, .obj. Вы должны настроить IIS, чтобы такие файлы можно было
-			загружать.</p>
-	</div>
-	<p>
-		Другими простыми альтернативами являются [link:http://stackoverflow.com/q/12905426/24874 discussed
-		here](обсуждается здесь)
-		на Stack Overflow.
-	</p>
-</div>
-
-</body>
-</html>

+ 1 - 1
docs/manual/ru/introduction/Loading-3D-models.html

@@ -30,7 +30,7 @@
 
 	<p>
 		Если вы новичок в управлении локальным сервером, начните с раздела
-		[link:#manual/introduction/How-to-run-things-locally how to run things locally] (Локальная разработка).
+		[link:#manual/introduction/Installation installation] (Локальная разработка).
 		Многих распространенных ошибок при просмотре 3D-моделей можно избежать, правильно разместив файлы.
 	</p>
 

+ 0 - 147
docs/manual/zh/introduction/How-to-run-things-locally.html

@@ -1,147 +0,0 @@
-<!DOCTYPE html>
-<html lang="zh">
-	<head>
-		<meta charset="utf-8">
-		<base href="../../../" />
-		<script src="page.js"></script>
-		<link type="text/css" rel="stylesheet" href="page.css" />
-	</head>
-	<body>
-		<h1>如何在本地运行Three.js([name])</h1>
-		<p>
-            倘若你只是使用Three.js库中所提供的几何体,且不载入任何纹理贴图,则网页是可以从本地的文件系统中打开,并且是能够直接运行的,只需在文件管理器中双击HTML文件,它就可以在浏览器中进行显示。
-            (此时你将在地址栏中看到类似这样的URL:<em>file:///yourFile.html</em>)
-
-		</p>
-
-		<h2>从外部文件载入的内容</h2>
-		<div>
-			<p>
-                倘若你需要从外部文件里载入几何体或是纹理贴图,由于浏览器[link:http://en.wikipedia.org/wiki/Same_origin_policy same origin policy](同源策略)的安全限制,从本地文件系统载入外部文件将会失败,同时抛出安全性异常。
-		 	</p>
-
-			<p>这里有两种方法来解决这个问题:</p>
-
-			<ol>
-				<li>
-                    在浏览器中改变本地文件的安全策略,这将使你可以通过<code>file:///yourFile.html</code>来直接运行本地文件系统中的文件。
-				</li>
-				<li>
-                    从本地的服务器运行文件,这可以让你通过<code>http://localhost/yourFile.html</code>来访问运行在本地服务器上的文件。
-				</li>
-			</ol>
-
-			<p>
-                倘若你选择第一种方法,请小心,倘若你使用同一个浏览器来进行日常网络冲浪,你将可能会触发一些漏洞。
-                你或许可以创建一个用于开发环境的独立的浏览器配置文件或者快捷方式,仅仅用于本地开发;这将使得日常使用环境与开发环境相分离,以保证日常使用环境的安全性。
-                接下来,我们来看一看除此之外的别的方法。
-			</p>
-		</div>
-
-
-		<h2>运行一个本地的服务器</h2>
-		<div>
-			<p>
-                很多的编程语言都具有一个内置的简易HTTP服务器。它们的功能并不像能够被用于生产环境的服务器,例如[link:https://www.apache.org/ Apache] 或者 [link:https://nginx.org NGINX]那样完善,
-                但对于你来测试three.js应用程序来说,它们就已经足够了。
-			</p>
-
-			<h3>流行的代码编辑器插件</h3>
-			<div>
-				<p>一些代码编辑器具有插件,可以根据需要生成简单的服务器。</p>
-				<ul>
-					<li>Visual Studio Code [link:https://marketplace.visualstudio.com/items?itemName=ritwickdey.LiveServer Live Server] 插件。</li>
-					<li>Atom [link:https://atom.io/packages/atom-live-server Live Server] 插件。</li>
-				</ul>
-			</div>
-
-			<h3>Servez</h3>
-			<div>
-				<p>
-					[link:https://greggman.github.io/servez Servez] 一个具有界面的简单服务器。
-				</p>
-			</div>
-
-			<h3>Node.js server</h3>
-			<div>
-				<p>Node.js 具有一个简单的HTTP服务器包,如需安装,请执行:</p>
-				<code>npm install http-server -g</code>
-
-				<p>若要从本地目录下运行,请执行:</p>
-				<code>http-server . -p 8000</code>
-			</div>
-
-			<h3>Python server</h3>
-			<div>
-				<p>
-					如果你已经安装好了[link:http://python.org/ Python],只需要从命令行里便可以运行它(从工作目录):
-				</p>
-				<code>
-//Python 2.x
-python -m SimpleHTTPServer
-
-//Python 3.x
-python -m http.server
-				</code>
-
-				<p>这将会在为当前目录在8000端口创建一个服务器,也就是说你可以在地址栏里输入这个地址来访问已经创建好的服务器:</p>
-
-				<code>http://localhost:8000/</code>
-			</div>
-
-			<h3>Ruby server</h3>
-			<div>
-				<p>如果你已经安装好了Ruby,通过执行下列命也可以创建同样的服务器:</p>
-				<code>
-ruby -r webrick -e "s = WEBrick::HTTPServer.new(:Port => 8000, :DocumentRoot => Dir.pwd); trap('INT') { s.shutdown }; s.start"
-				</code>
-			</div>
-
-			<h3>PHP server</h3>
-			<div>
-				<p>PHP自从5.4.0版本开始,就内置了一个Web服务器:</p>
-				<code>php -S localhost:8000</code>
-			</div>
-
-			<h3>Lighttpd</h3>
-			<div>
-				<p>
-                    Lighttpd是一个轻量级的通用Web服务器,在这里,我们将介绍如何在OS X上使用HomeBrew来安装它。
-                    和我们在这里讨论的其他服务器不同,lighttpd是一个成熟的、准用于生产环境的服务器。
-				</p>
-
-				<ol>
-					<li>
-						通过HomeBrew安装lighttpd
-						<code>brew install lighttpd</code>
-					</li>
-					<li>
-                        在你希望作为服务器来运行的目录里,创建一个名为lighttpd.conf的配置文件。
-                        这是一个配置文件的样本:[link:http://redmine.lighttpd.net/projects/lighttpd/wiki/TutorialConfiguration TutorialConfiguration]。
-					 </li>
-					<li>
-                        在配置文件里,将server.document-root更改为你将要创建的服务器中的文件的所在的目录。
-					</li>
-					<li>
-						通过这个命令来启动:
-						<code>lighttpd -f lighttpd.conf</code>
-					</li>
-					<li>
-						使用浏览器打开http://localhost:3000/,然后服务器将可以从你所选择的目录中向你提供静态文件。
-					</li>
-				</ol>
-			</div>
-			<h3>IIS</h3>
-			<div>
-				<p>如果你正在使用Microsoft IIS来作为网站服务器,在服务器载入之前,请为.fbx扩展名增加MIME类型。</p>
-				<code>File name extension: fbx        MIME Type: text/plain</code>
-				<p>在默认情况下,IIS阻止 .fbx、 .obj 文件的下载,因此你必须对IIS进行配置,使得这些类型的文件可以被下载。</p>
-			</div>
-
-			<p>
-                其它简单的替代方案你可以在Stack Overflow上找到:[link:http://stackoverflow.com/q/12905426/24874 click here]。
-			</p>
-		</div>
-
-	</body>
-</html>

+ 1 - 1
docs/manual/zh/introduction/Loading-3D-models.html

@@ -25,7 +25,7 @@
 	<h2>在开始之前</h2>
 
 	<p>
-		如果你是第一次运行一个本地服务器,可以先阅读[link:#manual/introduction/How-to-run-things-locally how to run things locally]。
+		如果你是第一次运行一个本地服务器,可以先阅读[link:#manual/introduction/Installation installation]。
 		正确地托管文件,可以避免很多查看3D模型时的常见错误。
 	</p>
 

+ 2 - 1
docs/page.css

@@ -115,7 +115,8 @@ p,
 div,
 table,
 ol,
-ul {
+ul,
+summary {
 	margin-top: 16px;
 	margin-bottom: 16px;
 }

+ 1 - 1
test/unit/README.md

@@ -9,7 +9,7 @@ You can run the unit tests in two environments:
 - Node.js: Execute `npm run test-unit` from the root folder
 - Browser: Execute `npx servez -p 8080 --ssl` (or run any other local web sever) from the root folder and access `https://localhost:8080/test/unit/UnitTests.html` in a web browser. 
 
-See [How to run things locally](https://threejs.org/docs/#manual/introduction/How-to-run-things-locally) for more information.
+See [Installation](https://threejs.org/docs/#manual/introduction/Installation) for more information.
 
 ## Notes