WIP: TS Typings

.eslintrc.json

@@ -0,0 +1,72 @@
+{
+  "env": {
+    "browser": true,
+    "shared-node-browser": true,
+    "es6": true,
+    "node": true
+  },
+  "extends": [
+    "prettier",
+    "prettier/react",
+    "prettier/@typescript-eslint",
+    "plugin:prettier/recommended",
+    "plugin:react-hooks/recommended",
+    "plugin:import/errors",
+    "plugin:import/warnings"
+  ],
+  "plugins": ["@typescript-eslint", "react", "prettier", "react-hooks", "import", "jest"],
+  "parser": "@typescript-eslint/parser",
+  "parserOptions": {
+    "ecmaFeatures": {
+      "ecmaVersion": 2018,
+      "jsx": true
+    },
+    "sourceType": "module"
+  },
+  "rules": {
+    "curly": ["warn", "multi-line", "consistent"],
+    "no-console": "off",
+    "no-empty-pattern": "warn",
+    "no-duplicate-imports": "error",
+    "import/no-unresolved": ["error", { "commonjs": true, "amd": true }],
+    "import/export": "error",
+    "import/named": "off",
+    "import/no-named-as-default": "off",
+    "import/no-named-as-default-member": "off",
+    "import/namespace": "off",
+    "import/default": "off",
+    "@typescript-eslint/explicit-module-boundary-types": "off",
+    "no-unused-vars": ["warn"],
+    "react/jsx-uses-react": "error",
+    "react/jsx-uses-vars": "error",
+    "@typescript-eslint/no-unused-vars": ["warn", { "argsIgnorePattern": "^_", "varsIgnorePattern": "^_" }],
+    "@typescript-eslint/no-use-before-define": "off",
+    "@typescript-eslint/no-empty-function": "off",
+    "@typescript-eslint/no-empty-interface": "off",
+    "@typescript-eslint/no-explicit-any": "off",
+    "jest/consistent-test-it": ["error", { "fn": "it", "withinDescribe": "it" }]
+  },
+  "settings": {
+    "react": {
+      "version": "detect"
+    },
+    "import/extensions": [".js", ".jsx", ".ts", ".tsx"],
+    "import/parsers": {
+      "@typescript-eslint/parser": [".js", ".jsx", ".ts", ".tsx"]
+    },
+    "import/resolver": {
+      "node": {
+        "extensions": [".js", ".jsx", ".ts", ".tsx", ".json"],
+        "paths": ["src"]
+      }
+    }
+  },
+  "overrides": [
+    {
+      "files": ["src"],
+      "parserOptions": {
+        "project": ["./tsconfig.json", "./storybook/tsconfig.json"]
+      }
+    }
+  ]
+}

package.json

@@ -9,6 +9,9 @@
     "prebuild": "rimraf dist",
     "build": "rollup -c && npm run copy",
     "prepare": "npm run build",
+    "types": "tsc --noEmit --emitDeclarationOnly false",
+    "eslint": "eslint --cache --fix src/**/*.{ts,tsx}",
+    "eslint:ci": "eslint src/**/*.{ts,tsx}",
     "copy": "copyfiles package.json readme.md LICENSE dist && json -I -f dist/package.json -e \"this.private=false; this.devDependencies=undefined; this.optionalDependencies=undefined; this.scripts=undefined; this.husky=undefined; this.prettier=undefined; this.jest=undefined; this['lint-staged']=undefined;\"",
     "test": "echo \"Error: no test specified\""
   },
@@ -20,7 +23,11 @@
   },
   "lint-staged": {
     "*.{js,jsx,ts,tsx}": [
-      "prettier --write"
+      "prettier --write",
+      "eslint --fix"
+    ],
+    "*.{ts,tsx}": [
+      "tsc --noEmit --emitDeclarationOnly false"
     ]
   },
   "repository": {
@@ -43,8 +50,20 @@
     "@babel/preset-env": "7.11.0",
     "@babel/preset-react": "7.10.4",
     "@babel/preset-typescript": "^7.10.4",
+    "@rollup/plugin-typescript": "^8.2.0",
+    "@types/three": "^0.125.3",
+    "@typescript-eslint/eslint-plugin": "^4.15.2",
+    "@typescript-eslint/parser": "^4.15.2",
+    "babel-eslint": "^10.1.0",
     "babel-plugin-transform-react-remove-prop-types": "^0.4.24",
     "copyfiles": "^2.3.0",
+    "eslint": "^7.7.0",
+    "eslint-config-prettier": "^6.11.0",
+    "eslint-plugin-import": "^2.22.0",
+    "eslint-plugin-jest": "^23.20.0",
+    "eslint-plugin-prettier": "^3.1.4",
+    "eslint-plugin-react": "^7.20.6",
+    "eslint-plugin-react-hooks": "^4.1.0",
     "husky": "^4.2.5",
     "json": "^10.0.0",
     "lint-staged": "^10.2.11",
@@ -58,7 +77,9 @@
     "rollup-plugin-multi-input": "^1.1.1",
     "rollup-plugin-node-resolve": "^5.2.0",
     "rollup-plugin-size-snapshot": "^0.12.0",
-    "three": "^0.126.0"
+    "three": "^0.126.0",
+    "tslib": "^2.1.0",
+    "typescript": "<4.2.0"
   },
   "dependencies": {
     "@webgpu/glslang": "^0.0.15",

rollup.config.js

@@ -5,6 +5,7 @@ import json from 'rollup-plugin-json'
 import glslify from 'rollup-plugin-glslify'
 import multiInput from 'rollup-plugin-multi-input'
 import { sizeSnapshot } from 'rollup-plugin-size-snapshot'
+import typescript from '@rollup/plugin-typescript'
 
 const root = process.platform === 'win32' ? path.resolve('/') : '/'
 const external = (id) => !id.startsWith('.') && !id.startsWith(root)
@@ -31,22 +32,24 @@ export default [
       json(),
       babel(getBabelOptions({ useESModules: true }, '>1%, not dead, not ie 11, not op_mini all')),
       resolve({ extensions }),
+      typescript(),
     ],
     preserveModules: true,
   },
   {
-    input: ['src/**/*.js', '!src/index.js'],
+    input: ['src/**/*.js', 'src/**/*.ts', '!src/index.js'],
     output: { dir: `dist`, format: 'esm' },
     external,
     plugins: [
       multiInput(),
       json(),
       babel(getBabelOptions({ useESModules: true }, '>1%, not dead, not ie 11, not op_mini all')),
       resolve({ extensions }),
+      typescript(),
     ],
   },
   {
-    input: ['src/**/*.js', '!src/index.js'],
+    input: ['src/**/*.js', 'src/**/*.ts', '!src/index.js'],
     output: { dir: `dist`, format: 'cjs' },
     external,
     plugins: [
@@ -56,12 +59,13 @@ export default [
       json(),
       babel(getBabelOptions({ useESModules: false })),
       resolve({ extensions }),
+      typescript(),
     ],
   },
   {
     input: `./src/index.js`,
     output: { file: `dist/index.cjs.js`, format: 'cjs' },
     external,
-    plugins: [json(), babel(getBabelOptions({ useESModules: false })), resolve({ extensions })],
+    plugins: [json(), babel(getBabelOptions({ useESModules: false })), resolve({ extensions }, typescript())],
   },
 ]