chore(internals): [v6] use preconstruct

Merge pull request #1067 from pmndrs/v6/preconstruct

Author: gsimone

.eslintignore

@@ -0,0 +1,3 @@
+dist/
+node_modules/
+.yarn/

babel.config.js

@@ -0,0 +1,25 @@
+const { version } = require('./package.json');
+
+const versionTransform = ({ types: t }) => ({
+  visitor: {
+    Identifier(path) {
+      (path.node.name === 'R3F_VERSION') && path.replaceWith(t.stringLiteral(version));
+    },
+  },
+})
+
+module.exports = {
+  plugins: [versionTransform],
+  presets: [
+    [
+      '@babel/preset-env',
+      {
+        targets: {
+          esmodules: true,
+        },
+      },
+    ],
+    '@babel/preset-react',
+    '@babel/preset-typescript',
+  ],
+}

package.json

@@ -23,10 +23,10 @@
     "type": "opencollective",
     "url": "https://opencollective.com/react-three-fiber"
   },
-  "main": "dist/index.cjs.js",
-  "module": "dist/index.js",
+  "main": "dist/react-three-fiber.cjs.js",
+  "module": "dist/react-three-fiber.esm.js",
+  "types": "dist/react-three-fiber.cjs.d.ts",
   "react-native": "dist/native.js",
-  "types": "dist/web/index.d.ts",
   "sideEffects": false,
   "husky": {
     "hooks": {
@@ -39,18 +39,17 @@
     ]
   },
   "scripts": {
-    "prebuild": "rimraf dist && npm run typegen",
-    "build": "rollup -c && rimraf dist/__tests__",
+    "build": "preconstruct build",
+    "dev": "preconstruct dev",
     "prepare": "husky install",
     "eslint": "eslint --fix src/**/*.{ts,tsx}",
-    "dev": "yarn --cwd ./examples start",
     "test": "echo null",
-    "typecheck": "tsc --noEmit --emitDeclarationOnly false --strict --jsx react",
-    "typegen": "tsc && mv dist/src/* dist && rm -rf dist/src || true"
+    "typecheck": "tsc --noEmit --emitDeclarationOnly false --strict --jsx react"
   },
   "size-limit": [
     {
-      "path": "dist/index.js",
+      "path": "dist/react-three-fiber.cjs.prod.js",
+      "import": "{ render }",
       "limit": "4500 ms"
     }
   ],
@@ -62,8 +61,6 @@
     "react-use-measure": "^2.0.3",
     "resize-observer-polyfill": "^1.5.1",
     "scheduler": "0.20.1",
-    "size-limit": "^4.10.0",
-    "tiny-emitter": "^2.1.0",
     "use-asset": "^1.0.2",
     "utility-types": "^3.10.0",
     "zustand": "^3.3.3"
@@ -74,67 +71,46 @@
     "three": ">=0.126"
   },
   "devDependencies": {
-    "@ampproject/rollup-plugin-closure-compiler": "^0.26.0",
     "@babel/core": "7.13.8",
-    "@babel/helper-call-delegate": "^7.12.13",
-    "@babel/plugin-transform-modules-commonjs": "7.13.8",
-    "@babel/plugin-transform-parameters": "7.13.0",
-    "@babel/plugin-transform-runtime": "7.13.9",
-    "@babel/plugin-transform-template-literals": "7.13.0",
     "@babel/preset-env": "7.13.9",
     "@babel/preset-react": "7.12.13",
     "@babel/preset-typescript": "^7.13.0",
-    "@rollup/plugin-commonjs": "^17.1.0",
-    "@rollup/plugin-inject": "^4.0.2",
-    "@rollup/plugin-strip": "^2.0.0",
+    "@preconstruct/cli": "^2.0.6",
     "@types/jest": "^26.0.20",
     "@types/lodash-es": "^4.17.4",
-    "@types/react": "^17.0.2",
     "@types/react-dom": "^17.0.1",
     "@types/react-native": "^0.63.51",
     "@types/react-reconciler": "^0.26.0",
     "@types/react-test-renderer": "^17.0.1",
+    "@types/react": "^17.0.2",
     "@types/scheduler": "^0.16.1",
     "@types/three": "^0.126.0",
     "@typescript-eslint/eslint-plugin": "^4.16.1",
     "@typescript-eslint/parser": "^4.16.1",
-    "babel-eslint": "^10.1.0",
-    "babel-plugin-transform-react-remove-prop-types": "^0.4.24",
     "copyfiles": "^2.4.1",
-    "cypress": "^6.6.0",
-    "eslint": "^7.21.0",
     "eslint-config-prettier": "^8.1.0",
     "eslint-import-resolver-alias": "^1.1.2",
     "eslint-plugin-import": "^2.22.1",
     "eslint-plugin-jest": "^24.1.7",
     "eslint-plugin-prettier": "^3.3.1",
-    "eslint-plugin-react": "^7.22.0",
     "eslint-plugin-react-hooks": "^4.2.0",
-    "expo-gl": "^10.1.0",
-    "expo-three": "^5.6.2",
+    "eslint-plugin-react": "^7.22.0",
+    "eslint": "^7.21.0",
     "husky": "^5.1.3",
-    "jest": "^26.6.3",
     "jest-cli": "^26.6.3",
     "jest-image-snapshot": "^4.4.0",
     "jest-puppeteer": "^4.4.0",
-    "json": "^10.0.0",
+    "jest": "^26.6.3",
     "lint-staged": "^10.5.4",
     "prettier": "^2.2.1",
     "puppeteer": "^8.0.0",
-    "react": "^16.11.0",
     "react-dom": "^16.11.0",
     "react-native": "^0.63.4",
     "react-test-renderer": "^17.0.1",
-    "rimraf": "^3.0.2",
-    "rollup": "^2.40.0",
-    "rollup-plugin-babel": "^4.4.0",
-    "rollup-plugin-commonjs": "^10.1.0",
-    "rollup-plugin-json": "^4.0.0",
-    "rollup-plugin-node-resolve": "^5.2.0",
-    "rollup-plugin-terser": "^7.0.2",
+    "react": "^16.11.0",
+    "size-limit": "^4.10.0",
     "three": "^0.126.1",
     "ts-jest": "^26.5.3",
-    "typescript": "^4.2.3",
-    "wait-on": "^5.2.1"
+    "typescript": "^4.2.3"
   }
 }

rollup.config.js

@@ -0,0 +1 @@
+export * from './web'

src/index.tsx

@@ -1,6 +1,5 @@
 import * as THREE from 'three'
 import * as React from 'react'
-import { name as rendererPackageName, version } from '../../package.json'
 import { is } from '../core/is'
 import { createStore, StoreProps, isRenderer, context } from '../core/store'
 import { createRenderer, extend, Root } from '../core/renderer'
@@ -115,8 +114,9 @@ function createPortal(children: React.ReactNode, container: any, impl?: any, key
 
 reconciler.injectIntoDevTools({
   bundleType: process.env.NODE_ENV === 'production' ? 0 : 1,
-  rendererPackageName,
-  version,
+  rendererPackageName: "react-three-fiber",
+  // @ts-ignore
+  version: R3F_VERSION,
 })
 
 export * from '../core/hooks'