Use threejs-miniprogram in WeChat Mini Program - [Installation]

1. Install via npm

• In the project directory, shift + right mouse button, open PowerShell, enter npm i threejs-miniprogram, and execute the installation;
• After the installation is complete, the directory will appear node_modules, check whether the file already exists threejs-miniprogram, the content is as follows:
  

2. Build npm in WeChat applet developer tools

• On the applet toolbar, [Tools] → "Build npm", you can complete the npm build, as shown in the figure below:
  

3. Import the adapted version of Three.js for the mini program

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 变量
      })
  }
})