如何将 Three.js 导入我的 Nuxt 项目 [英] How do I import Three.js into my Nuxt project
问题描述
我想将 THREE.js 中 examples 文件夹中的模块(例如 OBJLoader)导入到我的 Nuxt 项目中.
I want to import modules in examples folder in THREE.js such as OBJLoader into my Nuxt Project.
我可以导入三个的主文件夹，但尝试导入示例文件夹中的模块时出错.
I can import main folder of THREE, but error occurs when trying to import modules in examples folder.
在官方文档中尝试过这些步骤.
Tried these steps in official docs.
https://threejs.org/docs/index.html#manual/en/introduction/Import-via-modules
我在下面遇到错误
语法错误意外令牌{
<template>
</template>
<script>
import * as THREE from 'three'
import { GLTFLoader } from 'three/examples/jsm/loaders/GLTFLoader.js';
export default{
}
</script>
这是我的 github 仓库https://github.com/ksuhara/threejs-test
here are my github repository https://github.com/ksuhara/threejs-test
推荐答案
我终于找到了问题所在.
Finally I could find what was wrong.
嗯，这与 nuxt 构建系统有关.使用第三方库时，应将它们添加到 nuxt.config.js bild->transpile 数组中，以便它可以作为 Babel 的依赖项包含在内.
Well, it has to do with nuxt building system. When using third parts libs, you should add them into nuxt.config.js bild->transpile array so it can be included as a dependency with Babel.
转译:[三"]
参考:https://nuxtjs.org/api/configuration-build#transpile
这篇关于如何将 Three.js 导入我的 Nuxt 项目的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
