Dependencies were not found

Hello, I’m currently working on the app which is going to combine Vue.js and Three.js so I decided to use your library to make it possible. I think it’s a great package which gives a lot of possibilities, thanks for awesome library. Anyway, when I try to run the project then I got some dependencies error. First, I installed Trois.js library in my Vue project:

npm install three@0.127 troisjs

Then I wrote some code and imported basic elements to my Home.vue module, just like Renderer, Scene etc.

import {Renderer, Scene, Camera, Sphere} from 'troisjs'

When I run npm run serve then the error comes up:

These dependencies were not found:

three/examples/jsm/geometries/TextGeometry.js in ./node_modules/troisjs/build/trois.module.js
three/examples/jsm/loaders/FontLoader.js in ./node_modules/troisjs/build/trois.module.js

What’s interesting, TextGeometry and FontLoader exist in node_modules under abovementioned directory:

…build/trois.module.js

import { TextGeometry } from 'three/examples/jsm/geometries/TextGeometry.js';
import { FontLoader } from 'three/examples/jsm/loaders/FontLoader.js';
...

I don’t know why this error comes up, I reinstalled trois.js package but in vain. Still doesn’t work. This is my package.json file:

{
  "name": "troisapp",
  "version": "0.1.0",
  "private": true,
  "scripts": {
    "serve": "vue-cli-service serve",
    "build": "vue-cli-service build",
    "lint": "vue-cli-service lint"
  },
  "dependencies": {
    "core-js": "^3.6.5",
    "three": "^0.127.0",
    "troisjs": "^0.3.3",
    "vue": "^3.0.0",
    "vue-router": "^4.0.0-0",
    "vuex": "^4.0.0-0"
  },
  "devDependencies": {
    "@vue/cli-plugin-babel": "~4.5.0",
    "@vue/cli-plugin-eslint": "~4.5.0",
    "@vue/cli-plugin-router": "~4.5.0",
    "@vue/cli-plugin-vuex": "~4.5.0",
    "@vue/cli-service": "~4.5.0",
    "@vue/compiler-sfc": "^3.0.0",
    "@vue/eslint-config-prettier": "^6.0.0",
    "babel-eslint": "^10.1.0",
    "eslint": "^6.7.2",
    "eslint-plugin-prettier": "^3.3.1",
    "eslint-plugin-vue": "^7.0.0",
    "prettier": "^2.2.1"
  },
  "description": "## Project setup ``` npm install ```",
  "main": ".eslintrc.js",
  "keywords": [],
  "author": "",
  "license": "ISC"
}

and below there’s main.js file:

import { createApp } from "vue";
import App from "./App.vue";
import router from "./router";
import store from "./store";

createApp(App).use(store).use(router).mount("#app");

I also tried to import and then add TroisJSVuePlugin (in main.js file) but it doesn’t help at all. How can I address the problem with those missing dependencies?

[klevron]

Please setup a repo. You can also try to update your deps (vuejs and sfc compiler >= 3.2).

And don’t use troisjs for ssr, it is a client side lib, here is and example with nuxt 3 : https://github.com/troisjs/nuxt3-test

[SchroterQuentin]

I do have the same issue, in order to dirty fix it I update the trois.module.js with this :

import { TextGeometry } from 'three/src/geometries/TextGeometry.js';
import { FontLoader } from 'three/src/loaders/FontLoader.js';

But in my case TextGeometry and FontLoader does not exist under jsm. I guess there was a modification in three.js that broke some reference in trois