解决npm安装three.js无法使用的问题

文
章
目
录

• 引言
• 解决方法
• 本机（node版本为20，有管理员权限）
• 公司（node版本为14，申请了管理员权限）
• 小结

本文主要讲解关于解决npm安装three.js无法使用的问题相关内容，让我们来一起学习下吧！

引言

在使用npm安装three.js之后，f12调试出现Uncaught TypeError: Failed to resolve module specifier \"three\". Relative references must start with either \"/\", \"./\", or \"../\".的报错，在网上查阅了很多资料都没法解决，有很多就直接推荐使用CDN的方式，但是很讨厌。

解决方法

本机（node版本为20，有管理员权限）

开始在公司的电脑（没有管理员权限），然后使用失败，后面回家用自己的电脑，有管理员权限还是会报这个问题，之后对于three进行了降版本安装，然后就解决了。
在公司电脑没管理员权限，试了一下降版本还是失败的，但是直接引用three可以在插件里（import cost）看见大小（说明能引入成功，在家里电脑之前也是引入成功但没法用）

公司（node版本为14，申请了管理员权限）

import { WebGLRenderer } from \"../../../node_modules/three/build/three.module.js\";

之前在网上看见过这种方式，然后在本机上是无效的，之前在这里也是无效，但是把node卸了重新装且在管理员模式下，成功了，可能和步骤有关系，下面列出操作步骤。

1. 执行npm初始化npm init -y
2. 安装three包，我选择的0.149.0版本npm install --save three@0.149.0
3. 选择上述方式，直接引用node_modules里的路径

这种情况下，使用插件的时候，仍然会出现three的报错，这时候需要去插件中去把three替换成../../../build/three.module.js就可以正常使用了

小结

目前判断可能需要管理员权限？之前公司的没有管理员还是出问题，说实话还是不足以判定问题的产生条件，只能给出这两种解决方案。
虽然解决了，但感觉还是没有从根本上解决为什么three的这个引用是无效的，问朋友说什么打包工具啥的关系，叫我用框架说不定就解决了，还没有去尝试，如果前面这两种都碰到问题的朋友可以尝试去试下这种方法。

以上就是关于解决npm安装three.js无法使用的问题相关的全部内容，希望对你有帮助。欢迎持续关注潘子夜个人博客（www.panziye.com），学习愉快哦！