diff --git a/package.json b/package.json index a123f1bc6..4abcfd6a1 100644 --- a/package.json +++ b/package.json @@ -51,7 +51,7 @@ "scripts": { "dev": "cd playground/vue && npm run dev", "dev:nuxt": "cd playground/nuxt && npm run dev", - "build": "vite build", + "build": "vite build && node ./scripts/postbuild.mjs", "test": "vitest", "test:ci": "vitest run", "test:ui": "vitest --ui --coverage.enabled=true", diff --git a/scripts/postbuild.mjs b/scripts/postbuild.mjs new file mode 100644 index 000000000..c06f9979d --- /dev/null +++ b/scripts/postbuild.mjs @@ -0,0 +1,40 @@ +import { readdir, readFile, writeFile } from 'node:fs/promises' + +/** + * Adds `.js` when importing the ./src/index.js in the dts + * + * @return {Promise} + */ +async function patchRootDts() { + const dts = 'dist/index.d.ts' + const content = await readFile(dts, 'utf8') + await writeFile(dts, content.replaceAll('./src/index\'', './src/index.js\'')) +} + +/** + * Fix node16 issue: https://www.typescriptlang.org/tsconfig/#allowArbitraryExtensions + * - node10 and bundler will check for d.vue.ts and vue.d.ts file when importing a vue file in a dts + * - node16 will check only for d.vue.ts file, this function will just copy/paste the content of vue.d.ts to d.vue.ts + * + * @param path {String} + * @return {Promise} + */ +async function patchVueDts(path) { + const files = await readdir(path, { recursive: false }) + for (const file of files) { + if (file.endsWith('.vue.d.ts')) { + await writeFile(`${path}/${file.replace('.vue.d.ts', '.d.vue.ts')}`, await readFile(`${path}/${file}`, 'utf-8'), 'utf-8') + } + } +} + +async function fixNode16() { + await Promise.all([ + patchRootDts(), + patchVueDts('dist/src/components'), + patchVueDts('dist/src/composables/useLoader'), + patchVueDts('dist/src/composables/useTexture'), + ]) +} + +fixNode16() diff --git a/src/components/TresCanvas.vue b/src/components/TresCanvas.vue index 51a355461..8d0d4490b 100644 --- a/src/components/TresCanvas.vue +++ b/src/components/TresCanvas.vue @@ -6,8 +6,8 @@ import type { WebGLRendererParameters, } from 'three' import type { App, Ref } from 'vue' -import type { RendererPresetsType } from '../composables/useRenderer/const' -import type { TresCamera, TresObject, TresScene } from '../types/' +import type { RendererPresetsType } from '../composables/useRenderer/const.js' +import type { TresCamera, TresObject, TresScene } from '../types/index.js' import { PerspectiveCamera, Scene } from 'three' import * as THREE from 'three' @@ -30,12 +30,12 @@ import { type TresContext, useLogger, useTresContextProvider, -} from '../composables' -import { extend } from '../core/catalogue' -import { nodeOps } from '../core/nodeOps' +} from '../composables/index.js' +import { extend } from '../core/catalogue.js' +import { nodeOps } from '../core/nodeOps.js' -import { registerTresDevtools } from '../devtools' -import { disposeObject3D } from '../utils/' +import { registerTresDevtools } from '../devtools/index.js' +import { disposeObject3D } from '../utils/index.js' export interface TresCanvasProps extends Omit { diff --git a/src/composables/index.ts b/src/composables/index.ts index b703704c0..9704b5365 100644 --- a/src/composables/index.ts +++ b/src/composables/index.ts @@ -1,16 +1,16 @@ import UseLoader from './useLoader/component.vue' import UseTexture from './useTexture/component.vue' -export * from './useCamera/' -export * from './useLoader' -export * from './useLogger' -export * from './useLoop' -export * from './useRaycaster' -export * from './useRenderer/' -export * from './useRenderLoop' -export * from './useSeek' -export * from './useTexture' -export * from './useTresContextProvider' -export * from './useTresEventManager' -export { onTresReady } from './useTresReady' +export * from './useCamera/index.js' +export * from './useLoader/index.js' +export * from './useLogger.js' +export * from './useLoop/index.js' +export * from './useRaycaster/index.js' +export * from './useRenderer/index.js' +export * from './useRenderLoop/index.js' +export * from './useSeek/index.js' +export * from './useTexture/index.js' +export * from './useTresContextProvider/index.js' +export * from './useTresEventManager/index.js' +export { onTresReady } from './useTresReady/index.js' export { UseLoader, UseTexture } diff --git a/src/composables/useCamera/index.ts b/src/composables/useCamera/index.ts index 68c0090bf..281329db5 100644 --- a/src/composables/useCamera/index.ts +++ b/src/composables/useCamera/index.ts @@ -1,10 +1,10 @@ import type { OrthographicCamera } from 'three' -import type { TresScene } from '../../types' -import type { TresContext } from '../useTresContextProvider' +import type { TresScene } from '../../types/index.js' +import type { TresContext } from '../useTresContextProvider/index.js' import { Camera, PerspectiveCamera } from 'three' import { computed, onUnmounted, ref, watchEffect } from 'vue' -import { camera as isCamera } from '../../utils/is' +import { camera as isCamera } from '../../utils/is.js' export const useCamera = ({ sizes }: Pick & { scene: TresScene }) => { // the computed does not trigger, when for example the camera position changes diff --git a/src/composables/useLoader/component.vue b/src/composables/useLoader/component.vue index 0a63387cb..ddc0304f6 100644 --- a/src/composables/useLoader/component.vue +++ b/src/composables/useLoader/component.vue @@ -1,7 +1,7 @@