update

Author: ele828

.eslintrc.js

@@ -0,0 +1,27 @@
+module.exports = {
+  root: true,
+  parser: "babel-eslint",
+  parserOptions: {
+    ecmaVersion: 2018,
+    sourceType: 'module'
+  },
+  env: {
+    es6: true,
+    node: true
+  },
+  extends: [
+    "eslint:recommended"
+  ],
+  globals: {
+    'XMLHttpRequest': true,
+    'window': true,
+    'document': true,
+    'navigator': true,
+    'wx': true
+  },
+  rules: {
+    'no-console': process.env.NODE_ENV !== 'production' ? 0 : 2,
+    'no-useless-escape': 0,
+    'no-empty': 0
+  }
+}

LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2019 wechat-miniprogram
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

README.md

@@ -1 +1,38 @@
-# weapp-adapter
+# threejs-miniprogram
+Three.js 小程序 WebGL 的适配版本。
+
+## 使用
+
+可参考该代码片段[]()或参照以下流程：
+
+1. 通过 npm 安装
+
+   ```
+   npm install --save threejs-miniprogram
+   ```
+
+2. 导入小程序适配版本的 Three.js
+
+```javascript
+import {createScopedThreejs} from 'threejs-miniprogram'
+
+Page({
+  onReady() {
+    wx.createSelectorQuery()
+      .select('#webgl')
+      .node()
+      .exec((res) => {
+        const canvas = res[0].node
+        // 创建一个与 canvas 绑定的 three.js
+        const THREE = createScopedThreejs(canvas)
+        // 传递并使用 THREE 变量
+      })
+  }
+})
+```
+
+## 说明
+
+- 本项目当前使用的 Three.js 版本号为 0.108.0，如要更新 threejs 版本可发 PR 修改或 fork 后自行修改。
+- 该适配版本的 THREE 不在全局环境中，如使用 Three.js 的其他配套类库，需要自行传入 THREE 到类库中。
+- 如在使用过程中发现有适配问题，可通过 issue 反馈或发 PR 修复。

build/webpack.config.js

@@ -2,6 +2,12 @@ const fs = require('fs')
 const path = require('path')
 const StringReplacePlugin = require("string-replace-webpack-plugin");
 
+function resolveThreeModule() {
+  const threePath = require.resolve('three')
+  const code = fs.readFileSync(path.resolve(threePath), 'utf8')
+  return code
+}
+
 module.exports = {
   entry: path.join(__dirname, '../src/index'),
   target: 'web',
@@ -30,7 +36,7 @@ module.exports = {
             {
               pattern: /__INJECT_THREE__/ig,
               replacement: () => {
-                return fs.readFileSync(path.resolve(__dirname, '../vendor/three.js'), 'utf8')
+                return resolveThreeModule()
               }
             }
           ]

package.json

@@ -1,14 +1,12 @@
 {
-  "name": "miniprogram-threejs",
+  "name": "threejs-miniprogram",
   "version": "0.0.1",
-  "description": "ThreeJS adapted for WeChat MiniProgram",
+  "description": "ThreeJS adapter for WeChat MiniProgram",
   "main": "dist/index.js",
-  "directories": {
-    "test": "test"
-  },
   "scripts": {
     "dev": "webpack --config build/webpack.config.js --watch",
-    "build": "webpack --hide-modules --config build/webpack.config.js"
+    "build": "webpack --hide-modules --config build/webpack.config.js",
+    "lint": "eslint \"src/**/*.js\""
   },
   "miniprogram": "dist/",
   "author": "wechat-miniprogram",
@@ -18,7 +16,7 @@
     "@babel/plugin-proposal-class-properties": "^7.5.5",
     "@babel/preset-env": "^7.5.5",
     "babel-loader": "^8.0.6",
-    "eslint": "^3.4.0",
+    "eslint": "^3.19.0",
     "eslint-friendly-formatter": "^2.0.6",
     "eslint-loader": "^1.5.0",
     "eslint-plugin-jest": "^20.0.3",
@@ -27,6 +25,7 @@
     "path": "^0.12.7",
     "string-replace-loader": "^2.2.0",
     "string-replace-webpack-plugin": "^0.1.3",
+    "three": "^0.108.0",
     "webpack": "^4.39.1",
     "webpack-cli": "^3.3.6"
   }

src/EventTarget.js

@@ -28,7 +28,7 @@ export default class EventTarget {
         }
     }
 
-    removeEventListener(type, listener, options = {}) {
+    removeEventListener(type, listener) {
         const events = _events.get(this)
 
         if (events) {

src/XMLHttpRequest.js

@@ -112,9 +112,7 @@ export default class XMLHttpRequest extends EventTarget {
                 if (typeof data !== 'string' && !(data instanceof ArrayBuffer)) {
                     try {
                         data = JSON.stringify(data)
-                    } catch (e) {
-                        data = data
-                    }
+                    } catch (e) {}
                 }
 
                 this.status = statusCode

src/index.js

@@ -1,30 +1,34 @@
 import _XMLHttpRequest from './XMLHttpRequest'
 
-export function getAdaptedThreejs(canvas) {
+export function createScopedThreejs(canvas) {
   // adapt canvas
   canvas.style = {width: canvas.width + 'px', height: canvas.height + 'px'}
   canvas.addEventListener = function () {}
   canvas.removeEventListener = function () {}
 
+  // eslint-disable-next-line
   const document = {
     createElementNS(_, type) {
       if (type === 'canvas') return canvas
       if (type === 'img') return canvas.createImage()
     }
   }
 
+  // eslint-disable-next-line
   const window = {
     AudioContext: function() {},
     addEventListener: function() {},
     removeEventListener: function() {}
   }
+  // eslint-disable-next-line
   const XMLHttpRequest = _XMLHttpRequest
 
-  const innerExport = {};
+  const exports = {};
 
   // three.js source code will be injected here
+  // eslint-disable-next-line
   __INJECT_THREE__
 
-  return innerExport
+  return exports
 }