1. 为什么是 Mars3D？——从“三维GIS前端框架”到“必须亲手搭起来的环境”

Mars3D 是国内开发者在三维地理信息可视化领域绕不开的名字。它不是 Cesium 的简单封装，也不是 Three.js 的插件集合，而是一个真正面向国产化场景、适配政务、应急、电力、水利等垂直行业需求的自主可控三维WebGIS平台。我第一次接触它，是在一个省级智慧水务项目里——客户明确要求：不依赖国外地图服务、支持离线部署、能对接国产数据库和信创终端。当时团队试了三套方案，最后选中 Mars3D，不是因为它最炫，而是因为它的构建逻辑、目录结构、配置方式，天然就带着“工程可交付”的基因。

但问题来了：官方文档写得清楚，可真到本地npm install、npm run dev的那一刻，90% 的新手会卡在第一步。不是代码报错，而是环境本身在“拒绝配合”。你看到的可能是：

• npm : 无法加载文件 C:\Program Files\nodejs\npm.ps1，因为在此系统上禁止运行脚本
• Error: Cannot find module 'vue'（明明vue --version显示已安装）
• 启动成功后浏览器打开http://localhost:8000却一片空白，控制台报GET http://localhost:8000/mars3d.min.js net::ERR_ABORTED 404
• Nginx 配置完反向代理，地图瓦片请求全被 403 拦截，日志里只有一行directory index of "/data/mars3d/" is forbidden

这些都不是 Mars3D 的 Bug，而是环境链路中某个环节的权限、路径、协议或上下文被默认规则悄悄切断了。比如 PowerShell 执行策略限制，本质是 Windows 对未签名脚本的主动防御；Nginx 403，往往是因为root指向了非nginx用户可读的目录，或者autoindex on被误开；而mars3d.min.js找不到，则大概率是package.json中的build脚本没跑完，或者dist目录压根没生成——你以为在跑开发服务，其实连基础资源都没编译出来。

所以，“配置环境”这四个字，对 Mars3D 来说，从来不是装几个软件、敲几行命令那么简单。它是一次对Node.js 运行时机制、前端构建生命周期、HTTP 服务分发逻辑、文件系统权限模型的综合校验。你配的不是 Mars3D，是你本地整套开发栈的“可信执行边界”。我见过太多人花三天调通环境，结果上线前发现生产服务器用的是 CentOS 7 + OpenSSL 1.0.2，而本地 Node.js 18 默认启用 TLSv1.3 —— 环境一致性，才是 Mars3D 项目落地的第一道生死线。

这也是为什么我把这篇记录命名为“过程”，而不是“教程”。教程告诉你“该怎么做”，而过程告诉你“为什么非得这么做”、“哪一步松动了整个链条”、“当它不工作时，你该盯住哪一行日志”。接下来的内容，全部基于我在 7 个真实项目（含 3 个信创环境离线部署）中踩过的坑、记下的日志、截图的错误弹窗、反复验证的参数组合。没有假设，只有实测。

2. 环境链路全景拆解：四个核心组件如何咬合运转

Mars3D 的本地开发环境，表面看是“装 Node.js → 下载 Mars3D 示例 → npm install → npm run dev”，但背后实际存在一条四层嵌套的执行链路，每一层都承担不可替代的职责，且任一层失效都会导致整个流程中断。我把它们画成一个咬合齿轮模型（文字版），并标注每个齿轮的“齿距”——即最容易打滑的关键参数。

2.1 第一层：Node.js 运行时 —— 所有 JavaScript 的“呼吸系统”

Node.js 不是单纯的“JavaScript 解释器”，它是 Mars3D 构建工具（Vite/Vue CLI）的宿主环境，更是npm包管理器的执行引擎。它的版本选择，直接决定后续所有依赖能否安装、能否编译、能否运行。

• 为什么必须用 Node.js 16.x 或 18.x？
  Mars3D 官方示例（如mars3d-platform）的package.json中，engines.node字段明确限定为">=16.0.0"。这不是保守设定，而是因为其底层依赖cesium在 1.100+ 版本中大量使用了Array.prototype.at()、Promise.withResolvers()等 ES2022+ 语法，Node.js 14 默认不支持（需开启--harmony标志，但 Vite 不识别）。我实测过：Node.js 14.21.3 下npm install会成功，但npm run dev启动后控制台立刻报SyntaxError: Unexpected token '.'，指向node_modules/cesium/Source/Core/TaskProcessor.js的第 127 行 —— 就是at()方法调用。

• Windows 下 PowerShell 策略问题的本质
  npm : 无法加载文件 ... npm.ps1错误，根源在于 Windows PowerShell 的ExecutionPolicy（执行策略）默认为Restricted，禁止运行任何脚本（包括 npm 自带的.ps1封装器）。这不是安全漏洞，而是微软对脚本执行的分级管控。解决方案不是“关掉安全”，而是将策略调整为仅允许本地脚本执行：

  # 以管理员身份打开 PowerShell，执行： Set-ExecutionPolicy RemoteSigned -Scope CurrentUser

  RemoteSigned意味着：本地磁盘上的脚本无需签名即可运行，而来自互联网的脚本必须由受信任发布者签名。这是生产环境与开发环境的安全平衡点。CurrentUser范围确保只影响当前用户，不波及系统其他账户。

• npm 全局路径与权限陷阱
  很多人习惯npm install -g mars3d-cli，但若全局安装路径（如C:\Users\XXX\AppData\Roaming\npm）被防病毒软件锁定，或npm config get prefix返回的路径包含空格（如C:\Program Files\nodejs），npm link或全局命令调用就会失败。我的经验是：永远用nvm-windows管理 Node.js 版本，并将全局安装路径设为无空格、无权限限制的目录，例如D:\nvm\nodejs\global。设置方法：

  npm config set prefix "D:\\nvm\\nodejs\\global" npm config set cache "D:\\nvm\\nodejs\\cache"

2.2 第二层：前端构建工具 —— Mars3D 项目的“心脏起搏器”

Mars3D 示例项目（如mars3d-example）几乎全部基于 Vite 构建。它不像 Webpack 那样需要复杂配置，但对 Node.js 版本、依赖版本、甚至操作系统内核都有隐式要求。

• Vite 版本与 Node.js 的精确匹配表

  Vite 版本	最低 Node.js	关键特性依赖	实测 Mars3D 兼容性
  v4.5.0+	>=14.18	esbuild0.19+	✅ 官方示例默认使用
  v5.0.0	>=18.0	esbuild0.21+	⚠️ 需手动升级cesium至 1.115+
  v3.2.0	>=14.18	esbuild0.17+	❌cesium1.105 编译失败

  我曾因npm update自动升级 Vite 到 v5.0.0，导致npm run build时cesium的Worker模块报ReferenceError: self is not defined。原因在于 Vite v5 默认启用define: { 'process.env.NODE_ENV': '"production"' }，而旧版 Cesium 的 Worker 初始化逻辑依赖window.self，在构建环境下self未定义。解决方案：降级 Vite 或在vite.config.ts中显式关闭 define 注入：

  export default defineConfig({ define: {}, // 清空默认 define // ...其他配置 })

• vite.config.ts中base路径的致命影响
  Mars3D 加载mars3d.min.js和Cesium.js依赖绝对路径。若你在vite.config.ts中设置了base: '/gis/'，那么所有静态资源请求路径都会被前置/gis/。但 Mars3D 的源码里，mars3d.js内部通过document.currentScript.src推导资源路径，一旦base不为/，它就找不到mars3d.min.js。实测现象：页面白屏，Network 面板显示GET http://localhost:8000/gis/mars3d.min.js 404。正确做法：开发环境base必须为'/'，生产环境若需子路径部署，应通过 Nginx 的location重写来实现，而非修改 Vite 配置。

2.3 第三层：HTTP 服务层 —— Nginx 作为“流量调度员”

npm run dev启动的是 Vite 的开发服务器（基于原生 Node.js HTTP 模块），它足够快，但不具备生产级的静态资源缓存、HTTPS 终止、跨域代理能力。而 Mars3D 项目上线，几乎必然用 Nginx 做反向代理或静态托管。这就要求本地环境必须能模拟真实部署结构。

• nginx.conf的最小可行配置（非模板，是实测有效版）
  很多教程直接复制官网nginx.conf，却忽略了 Mars3D 的特殊性：它需要同时提供 HTML 页面、JS/CSS 静态资源、以及Cesium/Assets/Textures等海量小文件。以下是我在线上环境稳定运行 2 年的精简配置（删除所有注释，只留必要指令）：

  user nginx; worker_processes 1; events { worker_connections 1024; } http { include mime.types; default_type application/octet-stream; sendfile on; keepalive_timeout 65; server { listen 80; server_name localhost; root /data/mars3d/dist; # 必须指向构建后的 dist 目录 index index.html; location / { try_files $uri $uri/ /index.html; # 支持 Vue Router history 模式 } # 关键：Cesium 资源路径映射 location /Cesium/ { alias /data/mars3d/node_modules/cesium/Build/Cesium/; expires 1h; add_header Cache-Control "public, max-age=3600"; } # 关键：Mars3D 核心库路径映射 location /mars3d/ { alias /data/mars3d/node_modules/mars3d/dist/; expires 1h; } # 静态数据目录（如 GeoJSON、影像瓦片） location /data/ { alias /data/mars3d/public/data/; autoindex off; # 禁用目录列表，防止敏感文件暴露 } } }

  提示：alias指令末尾的/是灵魂。alias /path/to/dir/会将/Cesium/请求映射到/path/to/dir/目录下；而alias /path/to/dir会映射到/path/to/dirCesium/—— 多一个字符，全盘皆输。

• Nginx 启动失败的三大高频原因

  1. 端口被占用：nginx: [emerg] bind() to 0.0.0.0:80 failed (10013: An attempt was made to access a socket in a way forbidden by its access permissions)。Windows 下，80 端口常被World Wide Web Publishing Service或 Skype 占用。解决方案：netsh http show servicestate查看占用进程，或改用listen 8080;。
  2. root 目录权限不足：Linux 下，若/data/mars3d/dist所属用户不是nginx，且目录权限为750，Nginx 工作进程会因无读取权限返回403 Forbidden。修复命令：chown -R nginx:nginx /data/mars3d/dist && chmod -R 755 /data/mars3d/dist。
  3. autoindex on误开：当location /块中错误添加autoindex on;，Nginx 会尝试列出目录内容。若index.html不存在，或root指向错误目录，就会返回403（因安全策略禁止目录列表）。务必确认index index.html;存在，且autoindex未启用。

2.4 第四层：编辑器与调试环境 —— VS Code 的“透视镜”

VS Code 本身不参与构建，但它提供的调试能力，是定位环境问题的终极武器。尤其当npm run dev启动后页面空白，控制台无报错时，VS Code 的Debugger for Chrome插件能让你直接在源码中打断点，查看mars3d.js初始化时的window对象状态。

• 关键调试配置.vscode/launch.json

  { "version": "0.2.0", "configurations": [ { "type": "pwa-chrome", "request": "launch", "name": "Launch Chrome against localhost", "url": "http://localhost:8000", "webRoot": "${workspaceFolder}", "sourceMapPathOverrides": { "webpack:///./src/*": "${webRoot}/src/*", "webpack:///./node_modules/*": "${webRoot}/node_modules/*" }, "skipFiles": [ "${workspaceFolder}/node_modules/**/*" ] } ] }

  sourceMapPathOverrides是核心。Mars3D 的node_modules/mars3d/dist/mars3d.min.js.map文件中，sources字段指向的是webpack:///./src/index.ts，而 VS Code 默认无法将这个虚拟路径映射到你本地的src/index.ts。此配置强制将webpack:///./src/映射到工作区根目录下的src/，让断点精准命中源码。

• VS Code 中npm脚本执行环境差异
  在 VS Code 终端中执行npm run dev，其环境变量继承自 VS Code 进程，而非系统 Shell。这意味着：若你在 PowerShell 中通过Set-ExecutionPolicy修改了策略，但 VS Code 终端启动的是cmd.exe，该策略不生效。解决方案：在 VS Code 设置中搜索terminal integrated default profile windows，将其设为PowerShell，并确保勾选Use Integrated Terminal Profile。

这四层组件，像一台精密钟表的齿轮组：Node.js 提供动力，Vite 控制节奏，Nginx 分配流量，VS Code 提供观测窗口。任何一个齿轮的齿形磨损（版本不匹配）、转速偏差（配置错误）、润滑不足（权限缺失），都会导致整机停摆。理解它们如何咬合，比记住命令更重要。

3. 实操全流程：从零开始搭建可验证的 Mars3D 开发环境

现在，我们把理论转化为动作。以下步骤，每一步都经过 Windows 10/11、Ubuntu 22.04、银河麒麟 V10（信创版）三平台交叉验证。所有命令、路径、配置均标注实测环境与预期输出，避免“理论上应该如此”的模糊表述。

3.1 步骤一：Node.js 与 npm 的“洁净安装”

目标：获得一个无污染、可复现、权限清晰的 Node.js 环境。

操作清单（Windows）：

1. 卸载所有现有 Node.js：控制面板 → 卸载程序 → 找到Node.js，右键卸载。关键动作：卸载后，手动删除残留目录C:\Program Files\nodejs和C:\Users\{用户名}\AppData\Roaming\npm。
2. 下载nvm-windows：访问 https://github.com/coreybutler/nvm-windows/releases，下载最新nvm-setup.zip，解压后以管理员身份运行install.bat。
3. 验证 nvm 安装：打开新 PowerShell 窗口，执行nvm version，应返回1.1.12（或当前最新版）。
4. 安装 Node.js 18.18.2（LTS）：nvm install 18.18.2。nvm 会自动下载、解压、软链接。执行nvm use 18.18.2切换版本。
5. 配置 npm 全局路径：

   npm config set prefix "D:\\nvm\\nodejs\\global" npm config set cache "D:\\nvm\\nodejs\\cache" # 将 D:\nvm\nodejs\global 添加到系统 PATH 环境变量

6. 修复 PowerShell 执行策略：

   Set-ExecutionPolicy RemoteSigned -Scope CurrentUser

7. 验证：重启 PowerShell，执行node -v应返回v18.18.2，npm -v返回9.8.1，npm config get prefix返回D:\\nvm\\nodejs\\global。

Ubuntu 22.04 专用步骤：

# 使用 NodeSource 仓库（比 apt 官方源更新） curl -fsSL https://deb.nodesource.com/setup_lts.x | sudo -E bash - sudo apt-get install -y nodejs # 验证 node -v # v18.18.2 npm -v # 9.8.1 # 创建无权限冲突的全局路径 sudo mkdir -p /opt/nodejs-global sudo chown -R $USER:$USER /opt/nodejs-global npm config set prefix "/opt/nodejs-global" echo 'export PATH="/opt/nodejs-global/bin:$PATH"' >> ~/.bashrc source ~/.bashrc

注意：不要使用sudo npm install -g！这会导致全局模块归属root，后续npm link会因权限拒绝失败。npm config set prefix后，所有-g安装都落在用户可写目录。

3.2 步骤二：获取 Mars3D 示例并初始化依赖

目标：获得一个能立即npm run dev启动的、未经修改的官方示例。

操作：

1. 创建项目目录：mkdir D:\projects\mars3d-demo && cd D:\projects\mars3d-demo
2. 克隆官方示例仓库（推荐mars3d-example，轻量且覆盖核心 API）：

   git clone https://gitee.com/mars3d/mars3d-example.git .

3. 检查package.json中的engines字段：

   "engines": { "node": ">=16.0.0" }

   确认与当前 Node.js 版本匹配。
4. 执行依赖安装：npm install。关键观察点：
   • 终端应显示found 0 vulnerabilities（若有high级漏洞，说明依赖版本过旧，需npm audit fix --force）。
   • node_modules目录大小应 ≥ 280MB（Cesium 占比超 200MB）。
   • node_modules/mars3d/dist/mars3d.min.js文件存在，大小 ≈ 1.2MB。
5. 验证构建脚本：npm run build。成功后，dist目录应生成，内含index.html、assets/（含index-*.js）、Cesium/（符号链接或复制文件）。

常见失败与修复：

• npm install卡在node-gyp rebuild：这是canvas或sharp依赖在编译原生模块。Windows 下需先安装 Python 3.10 和 Visual Studio Build Tools。Ubuntu 下执行sudo apt-get install build-essential python3。
• npm run build报Cannot find module 'cesium'：检查node_modules/cesium是否存在。若不存在，执行npm install cesium@1.105.0（Mars3D 示例指定版本）。

3.3 步骤三：启动开发服务器并验证功能

目标：在http://localhost:8000看到可交互的三维地球。

操作：

1. 启动开发服务：npm run dev。Vite 默认监听http://localhost:8000。
2. 打开浏览器访问http://localhost:8000。预期画面：一个蓝色地球旋转，左上角有 “Mars3D” Logo，底部有坐标显示。
3. 打开浏览器开发者工具（F12），切换到 Console 标签页。应无红色错误，仅有Mars3D v3.10.0 loaded.类似提示。
4. 切换到 Network 标签页，刷新页面。关键请求应全部 200：
   • index.html（Status: 200）
   • index-*.js（Status: 200，Size: ~1.5MB）
   • mars3d.min.js（Status: 200，Size: ~1.2MB）
   • Cesium/Workers/...（Status: 200，多个请求）

若页面白屏，按此顺序排查：

1. Console 中是否有Uncaught ReferenceError: mars3d is not defined？→ 检查index.html中<script src="./mars3d.min.js">路径是否正确，或vite.config.ts的base是否为/。
2. Network 中mars3d.min.js是否 404？→ 执行npm run build，确认dist/mars3d.min.js存在；或检查vite.config.ts中resolve.alias是否错误覆盖了mars3d路径。
3. Cesium/Workers/...请求 404？→ 这是 Cesium 的 Web Worker 资源，Vite 默认不会处理node_modules/cesium/Build/Cesium/Workers/目录。解决方案：在vite.config.ts中添加静态资源别名：

   export default defineConfig({ resolve: { alias: { 'cesium/Workers': path.resolve(__dirname, 'node_modules/cesium/Build/Cesium/Workers') } } })

3.4 步骤四：配置 Nginx 托管构建产物

目标：用 Nginx 替代 Vite 开发服务器，模拟真实部署。

操作（Windows）：

1. 下载 Nginx for Windows：https://nginx.org/en/download.html，选择Stable version（如nginx/Windows-1.24.0），解压到D:\nginx。
2. 备份原始conf/nginx.conf：copy D:\nginx\conf\nginx.conf D:\nginx\conf\nginx.conf.bak
3. 用上文2.3 节的最小可行配置替换conf/nginx.conf。务必修改root路径：

   root D:/projects/mars3d-demo/dist; # 注意：Windows 路径用正斜杠或双反斜杠

4. 启动 Nginx：D:\nginx\nginx.exe。无窗口弹出即为后台运行。
5. 验证：访问http://localhost（注意不是:8000）。应看到与npm run dev完全一致的地球页面。
6. 停止 Nginx：D:\nginx\nginx.exe -s stop

Ubuntu 22.04 专用步骤：

# 安装 Nginx sudo apt update && sudo apt install nginx -y # 创建 Mars3D 部署目录 sudo mkdir -p /data/mars3d/dist sudo chown -R $USER:$USER /data/mars3d # 复制构建产物 cp -r D:/projects/mars3d-demo/dist/* /data/mars3d/dist/ # 编辑 Nginx 配置 sudo nano /etc/nginx/sites-available/mars3d # 粘贴 2.3 节配置，root 改为 /data/mars3d/dist # 启用站点 sudo ln -sf /etc/nginx/sites-available/mars3d /etc/nginx/sites-enabled/ sudo nginx -t # 测试配置语法 sudo systemctl restart nginx

关键验证点：

• curl -I http://localhost应返回HTTP/1.1 200 OK。
• curl http://localhost/Cesium/Workers/createGeometry.js | head -n 5应返回 JS 代码片段，证明location /Cesium/别名生效。
• 打开浏览器开发者工具 Network 标签，观察请求http://localhost/Cesium/Workers/...的Response Headers中应有Cache-Control: public, max-age=3600，证明 Nginx 缓存策略生效。

至此，一个完整的、可验证的 Mars3D 开发与部署环境已搭建完毕。它不是“能跑就行”的玩具，而是具备生产级健壮性的最小可行单元。

4. 常见问题与排查技巧实录：那些让我熬夜到凌晨三点的错误

环境配置最折磨人的地方，不在于它有多难，而在于错误信息极其“诚实”又极其“误导”。它告诉你发生了什么，但从不告诉你为什么发生。以下是我在 7 个项目中，记录下来的 12 个高频问题，附带真实日志、根本原因、三步定位法和永久解决方案。每一个，都来自凌晨三点的屏幕蓝光。

4.1 问题 1：npm run dev启动成功，但浏览器打开http://localhost:8000显示Cannot GET /，空白页

实测日志：

[vite] new dependencies optimized: mars3d, cesium VITE v4.5.0 ready in 1230 ms ➜ Local: http://localhost:8000/ ➜ Network: use --host to expose

浏览器 Network 面板：index.htmlStatus200，但index-*.js和mars3d.min.js全部404。

根本原因：Vite 开发服务器的base配置与index.html中资源路径不一致。vite.config.ts中base: './'会让所有<script src="mars3d.min.js">解析为http://localhost:8000/./mars3d.min.js，而服务器只响应/mars3d.min.js。

三步定位法：

1. 查看index.html源码，确认<script>标签的src属性是相对路径（如src="mars3d.min.js"）还是绝对路径（如src="/mars3d.min.js"）。
2. 执行npm run build，检查dist/index.html中的src路径。若为src="/mars3d.min.js"，则vite.config.ts中base必须为'/'。
3. 在浏览器地址栏输入http://localhost:8000/mars3d.min.js，若返回404，说明 Vite 未正确托管该文件。

永久解决方案：

• 删除vite.config.ts中所有base配置，让其使用默认值'/'。
• 若必须使用子路径开发，改用vite-plugin-rewrite插件，在vite.config.ts中重写资源路径：

  import rewrite from 'vite-plugin-rewrite' export default defineConfig({ plugins: [rewrite({ rules: [ { from: /^\/mars3d\.min\.js$/, to: '/node_modules/mars3d/dist/mars3d.min.js' } ] })] })

4.2 问题 2：Nginx 启动后，访问http://localhost返回403 Forbidden

实测日志（Nginx error.log）：

2023/10/15 02:17:23 [error] 12345#0: *1 directory index of "/data/mars3d/dist/" is forbidden

根本原因：Nginx 在location /块中找不到index.html，且autoindex off（默认），于是拒绝列出目录内容，返回 403。

三步定位法：

1. 执行ls -l /data/mars3d/dist/（Linux）或dir D:\projects\mars3d-demo\dist（Windows），确认index.html文件存在且大小 > 0。
2. 检查nginx.conf中server块的root指令，是否指向dist目录的父目录？例如root /data/mars3d;而非root /data/mars3d/dist;。
3. 在location /块中，确认index index.html;指令存在。

永久解决方案：

• root指令必须精确指向dist目录（如root /data/mars3d/dist;）。
• location /块中，index index.html;必须存在，且index.html文件名与实际文件名完全一致（区分大小写）。
• 禁用autoindex：确保location /块中无autoindex on;，这是安全最佳实践。

4.3 问题 3：地图加载后，控制台报Failed to load resource: the server responded with a status of 404 ()，请求 URL 为http://localhost:8000/Cesium/Assets/Textures/Default.png

实测日志：Network 面板中，Default.png请求404，Request URL显示为http://localhost:8000/Cesium/Assets/Textures/Default.png。

根本原因：Cesium 的纹理资源路径是硬编码在Cesium.js中的。Vite 开发服务器默认不托管node_modules/cesium/Build/Cesium/Assets/目录，因此请求 404。

三步定位法：

1. 在项目根目录执行ls node_modules/cesium/Build/Cesium/Assets/Textures/Default.png（Linux/Mac）或dir node_modules\cesium\Build\Cesium\Assets\Textures\Default.png（Windows），确认文件存在。
2. 访问http://localhost:8000/node_modules/cesium/Build/Cesium/Assets/Textures/Default.png，若返回404，证明 Vite 未暴露该路径。
3. 查看vite.config.ts，确认无server.fs.strict: false配置（该配置允许访问node_modules，但不推荐）。

永久解决方案：

• 推荐：在vite.config.ts中添加静态资源别名，将Cesium/Assets映射到物理路径：

  export default defineConfig({ resolve: { alias: { 'cesium/Assets': path.resolve(__dirname, 'node_modules/cesium/Build/Cesium/Assets') } } })

• 备选：在vite.config.ts中启用server.fs.strict: false，并添加server.fs.allow：

  export default defineConfig({ server: { fs: { strict: false, allow: ['node_modules/cesium/Build/Cesium'] } } })

4.4 问题 4：npm install时，node-gyp编译canvas失败，报错MSBUILD : error MSB4025: The project file could not be loaded. Root element is missing.

实测日志：

gyp ERR! build error gyp ERR! stack Error: `C:\Windows\Microsoft.NET\Framework\v4.0.30319\msbuild.exe` failed with exit code: 1 gyp ERR! stack at ChildProcess.onExit (D:\nvm\nodejs\18.18.2\node_modules\npm\node_modules\node-gyp\lib\build.js:194:23) gyp ERR! System Windows 10 10.0.19045 gyp ERR! command "D:\\nvm\\nodejs\\18.18.2\\node.exe" "D:\\nvm\\nodejs\\18.18.2\\node_modules\\npm\\node_modules\\node-gyp\\bin\\node-gyp.js" "rebuild" gyp ERR! cwd D:\projects\mars3d-demo\node_modules\canvas gyp ERR! node -v v18.18.2 gyp