Add vite building, tsc lib compile.

examples/picking-plugin/script.ts

@@ -5,6 +5,7 @@ async function init() {
 
     const viewer = new ThreeViewer({
         canvas: document.getElementById('mcanvas') as HTMLCanvasElement,
+        msaa: true,
     })
 
     const picking = viewer.addPluginSync(PickingPlugin)

examples/transform-controls-plugin/script.ts

@@ -17,7 +17,7 @@ async function init() {
     const model = await viewer.load<IObject3D>('https://threejs.org/examples/models/gltf/DamagedHelmet/glTF/DamagedHelmet.gltf')
 
     const ui = viewer.addPluginSync(new TweakpaneUiPlugin(true))
-    ui.setupPluginUi(TransformControlsPlugin)
+    ui.setupPluginUi(TransformControlsPlugin, {expanded: true})
     ui.setupPluginUi(PickingPlugin)
 
     // Get the underlying transform controls (instance of TransformControls2)

package.json

@@ -1,25 +1,30 @@
 {
   "name": "threepipe",
-  "version": "0.0.19",
+  "version": "0.0.20-dev.1",
   "description": "A 3D viewer framework built on top of three.js in TypeScript with a focus on quality rendering, modularity and extensibility.",
-  "main": "src/index.ts",
+  "main": "dist/index.js",
   "module": "dist/index.mjs",
   "types": "src/index.ts",
   "sources": "src/index.ts",
   "browser": "dist/index.js",
   "type": "module",
   "scripts": {
+    "compile": "rimraf lib && npm run compile:esm && npm run copy:css",
+    "compile:esm": "tsc -p ./src",
+    "copy:css": "copyfiles -u 1 \"src/**/*.css\" lib",
     "new:pack": "npm run prepare && clean-package && npm pack && clean-package restore",
     "new:publish": "npm run prepare && clean-package && npm publish && clean-package restore",
-    "build": "rimraf dist && npm run update-version && NODE_ENV=production rollup -c",
-    "dev": "rollup -c -w",
+    "build:rollup": "rimraf dist && npm run update-version && NODE_ENV=production rollup -c",
+    "build": "npm run update-version && vite build",
+    "dev:rollup": "rollup -c -w",
+    "dev": "NODE_ENV=development vite build --watch",
     "build-examples": "tsc --project examples/tsconfig.build.json",
     "dev-examples": "tsc --project examples/tsconfig.build.json -w",
     "serve-docs": "ws -d docs -p 8080",
     "serve": "ws -d . -p 9229",
     "docs": "npx typedoc && markdown-to-html",
     "build-plugins": "node scripts/build-plugins.mjs",
-    "prepare": "npm run build && npm run build-plugins && npm run build-examples",
+    "prepare": "npm run build && npm run compile && npm run build-plugins && npm run build-examples",
     "update-version": "echo \"export const VERSION = '$npm_package_version'\" > src/viewer/version.ts"
   },
   "clean-package": {
@@ -74,12 +79,14 @@
     "@rollup/plugin-commonjs": "^25.0.0",
     "@rollup/plugin-json": "^6.0.0",
     "@rollup/plugin-node-resolve": "^15.0.2",
+    "@rollup/plugin-replace": "^5.0.2",
     "@rollup/plugin-terser": "^0.4.3",
-    "@rollup/plugin-typescript": "^11.1.1",
+    "@rollup/plugin-typescript": "^11.1.5",
     "@types/stats.js": "^0.17.0",
     "@typescript-eslint/eslint-plugin": "^5.59.7",
     "@typescript-eslint/parser": "^5.59.5",
     "clean-package": "^2.2.0",
+    "copyfiles": "^2.4.1",
     "eslint": "^8.40.0",
     "eslint-import-resolver-typescript": "^3.5.5",
     "eslint-plugin-deprecation": "^1.4.1",
@@ -87,18 +94,19 @@
     "eslint-plugin-import": "^2.27.5",
     "local-web-server": "^5.3.0",
     "markdown-to-html-cli": "^3.7.0",
+    "popmotion": "^11.0.5",
     "rimraf": "^5.0.1",
     "rollup": "^3.23.0",
-    "rollup-plugin-license": "^3.0.1",
     "rollup-plugin-glsl": "^1.3.0",
+    "rollup-plugin-license": "^3.0.1",
     "rollup-plugin-postcss": "^4.0.2",
-    "three": "https://github.com/repalash/three.js-modded/releases/download/v0.152.2018/package.tgz",
+    "three": "https://github.com/repalash/three.js-modded/releases/download/v0.152.2019/package.tgz",
     "tslib": "^2.5.0",
     "typedoc": "^0.25.6",
     "typescript": "^5.3.3",
     "typescript-plugin-css-modules": "^5.0.1",
-    "@rollup/plugin-replace": "^5.0.2",
-    "popmotion": "^11.0.5"
+    "vite": "^5.0.11",
+    "vite-plugin-dts": "^3.7.0"
   },
   "dependencies": {
     "@types/three": "https://github.com/repalash/three-ts-types/releases/download/v0.152.1019/package.tgz",

plugins/blend-importer/src/global.d.ts

@@ -28,7 +28,10 @@ declare module '*.css' {
     const content: string
     export default content
 }
-
+declare module '*.css?inline' { // for vite
+    const content: string
+    export default content
+}
 // export {}
 
 // hack for typedoc

plugins/blueprintjs/src/global.d.ts

@@ -28,6 +28,10 @@ declare module '*.css' {
     const content: string
     export default content
 }
+declare module '*.css?inline' { // for vite
+    const content: string
+    export default content
+}
 
 // export {}
 

plugins/extra-importers/src/global.d.ts

@@ -28,6 +28,10 @@ declare module '*.css' {
     const content: string
     export default content
 }
+declare module '*.css?inline' { // for vite
+    const content: string
+    export default content
+}
 
 // export {}
 

plugins/geometry-generator/rollup.config.mjs

@@ -62,6 +62,7 @@ export default {
         replace({
             'from \'three\'': 'from \'threepipe\'',
             delimiters: ['', ''],
+            preventAssignment: true,
         }),
         replace({
             'process.env.NODE_ENV': JSON.stringify('production'),

plugins/geometry-generator/src/global.d.ts

@@ -28,6 +28,11 @@ declare module '*.css' {
     const content: string
     export default content
 }
+declare module '*.css?inline' { // for vite
+    const content: string
+    export default content
+}
+
 
 // export {}
 

plugins/plugin-template-rollup/src/global.d.ts

@@ -28,6 +28,10 @@ declare module '*.css' {
     const content: string
     export default content
 }
+declare module '*.css?inline' { // for vite
+    const content: string
+    export default content
+}
 
 // export {}
 

plugins/tweakpane-editor/src/global.d.ts

@@ -28,7 +28,7 @@ declare module '*.css' {
     const content: string
     export default content
 }
-declare module '*.css?inline' {
+declare module '*.css?inline' { // for vite
     const content: string
     export default content
 }

plugins/tweakpane/src/global.d.ts

@@ -28,7 +28,7 @@ declare module '*.css' {
     const content: string
     export default content
 }
-declare module '*.css?inline' {
+declare module '*.css?inline' { // for vite
     const content: string
     export default content
 }

src/tsconfig.json

@@ -0,0 +1,7 @@
+{
+    "extends": "../tsconfig",
+    "compilerOptions": {
+        "outDir": "../lib",
+        "declarationDir": "../lib",
+    }
+}

vite.config.js

@@ -0,0 +1,76 @@
+import {defineConfig} from 'vite'
+import json from '@rollup/plugin-json';
+import dts from 'vite-plugin-dts'
+import packageJson from './package.json';
+import license from 'rollup-plugin-license';
+import replace from '@rollup/plugin-replace';
+import glsl from 'rollup-plugin-glsl';
+import path from 'node:path';
+
+const isProd = process.env.NODE_ENV === 'production'
+const { name, version, author } = packageJson
+const {main, module, browser} = packageJson['clean-package'].replace
+
+export default defineConfig({
+    optimizeDeps: {
+        exclude: ['uiconfig.js', 'ts-browser-helpers'],
+    },
+    // define: {
+    //     'process.env': process.env
+    // },
+    build: {
+        sourcemap: true,
+        minify: isProd,
+        cssMinify: isProd,
+        cssCodeSplit: false,
+        watch: !isProd ? {
+            buildDelay: 1000,
+        } : null,
+        lib: {
+            entry: 'src/index.ts',
+            formats: isProd ? ['es', 'umd'] : ['es'],
+            name: name,
+            fileName: (format) => (format === 'umd' ? browser : module).replace('dist/', ''),
+        },
+        outDir: 'dist',
+        emptyOutDir: isProd,
+        commonjsOptions: {
+            exclude: [/uiconfig.js/, /ts-browser-helpers/],
+        },
+        rollupOptions: {
+            output: {
+                // inlineDynamicImports: false,
+            },
+        },
+    },
+    plugins: [
+        isProd ? dts({tsconfigPath: './tsconfig.json'}) : null,
+        replace({
+            'process.env.NODE_ENV': JSON.stringify(isProd ? 'production' : 'development'),
+            preventAssignment: true,
+        }),
+        glsl({ // todo: minify glsl.
+            include: 'src/**/*.glsl',
+        }),
+        json(),
+        // postcss({
+        //     modules: false,
+        //     autoModules: true,  // todo; issues with typescript import css, because inject is false
+        //     inject: false,
+        //     minimize: isProduction,
+        //     // Or with custom options for `postcss-modules`
+        // }),
+        license({
+            banner: `
+        @license
+        ${name} v${version}
+        Copyright 2022<%= moment().format('YYYY') > 2022 ? '-' + moment().format('YYYY') : null %> ${author}
+        ${packageJson.license} License
+      `,
+            thirdParty: {
+                output: path.join(__dirname, 'dist', 'dependencies.txt'),
+                includePrivate: true, // Default is false.
+            },
+        }),
+    ],
+})