Configure TypeScript

Author: widoz

.eslintrc.js

@@ -0,0 +1,10 @@
+const baseConfiguration = require('@wordpress/scripts/config/.eslintrc.js');
+
+module.exports = {
+	...baseConfiguration,
+	settings: {
+		'import/resolver': {
+			typescript: {},
+		},
+	},
+};

.gitignore

@@ -3,3 +3,5 @@
 /coverage
 /vendor/
 /node_modules/
+
+composer.lock

.prettierrc.js

@@ -0,0 +1,3 @@
+const prettierConfig = require('@wordpress/scripts/config/.prettierrc.js')
+
+module.exports = prettierConfig

.prettierrc.json

@@ -1,6 +1,6 @@
 /** @type {import('ts-jest').JestConfigWithTsJest} */
 module.exports = {
-  preset: 'ts-jest',
-  testEnvironment: 'node',
-  moduleDirectories: ['node_modules'],
-}
+	preset: 'ts-jest',
+	testEnvironment: 'jsdom',
+	moduleDirectories: ['node_modules'],
+};

jest.config.ts

@@ -6,14 +6,19 @@
   "main": "./sources/js/src/index.ts",
   "types": "./sources/js/src/@types/index.d.ts",
   "license": "GPL-2.0-or-later",
+  "engines": {
+    "node": "16"
+  },
   "devDependencies": {
     "@faker-js/faker": "^7.6.0",
     "@jest/globals": "^29.4.3",
     "@total-typescript/shoehorn": "^0.1.0",
     "@trivago/prettier-plugin-sort-imports": "^4.0.0",
     "@wordpress/dependency-extraction-webpack-plugin": "^4.8.0",
     "@wordpress/env": "^5.9.0",
+    "@wordpress/eslint-plugin": "^14.8.0",
     "@wordpress/scripts": "^25.1.0",
+    "eslint-import-resolver-typescript": "^3.5.5",
     "jest": "^29.4.3",
     "prettier": "^2.8.1",
     "ts-jest": "^29.0.5",
@@ -36,6 +41,8 @@
     "build": "wp-scripts build --webpack-src-dir=./sources/js/src",
     "build:dev": "wp-scripts build --mode=development --webpack-src-dir=./sources/js/src",
     "cs:fix": "wp-scripts format ./sources/js",
+    "lint:js": "wp-scripts lint-js",
+    "lint:js:fix": "wp-scripts lint-js --fix",
     "test": "jest"
   }
 }

package.json

@@ -1,26 +1,36 @@
 {
   "compilerOptions": {
+    "alwaysStrict": true,
+    "exactOptionalPropertyTypes": true,
+    "noFallthroughCasesInSwitch": true,
+    "noImplicitAny": true,
+    "noImplicitOverride": true,
+    "noImplicitReturns": true,
+    "noImplicitThis": true,
+    "noPropertyAccessFromIndexSignature": true,
+    "noUncheckedIndexedAccess": true,
+    "noUnusedLocals": true,
+    "noUnusedParameters": true,
+    "strict": true,
+    "useUnknownInCatchVariables": true,
     "resolveJsonModule": true,
     "sourceMap": true,
     "jsx": "react",
-    "noImplicitThis": true,
-    "strictNullChecks": true,
-    "alwaysStrict": true,
     "skipLibCheck": true,
     "esModuleInterop": true,
     "baseUrl": ".",
     "paths": {
-      "@types": [
+      "@entities-search-types": [
         "./sources/js/src/@types"
       ],
       "@entities-search": [
         "./sources/js/src"
-      ],
+      ]
     },
   },
   "include": [
-    "./sources/js/**/*",
-    "./tests/js/**/*"
+    "sources/js/**/*",
+    "tests/js/**/*"
   ],
   "exclude": [
     "node_modules"

tsconfig.json

@@ -1,22 +1,26 @@
-const path = require('path')
-const baseConfiguration = require('@wordpress/scripts/config/webpack.config')
-const DependencyExtractionWebpackPlugin = require('@wordpress/dependency-extraction-webpack-plugin')
+const path = require('path');
+const baseConfiguration = require('@wordpress/scripts/config/webpack.config');
+const DependencyExtractionWebpackPlugin = require('@wordpress/dependency-extraction-webpack-plugin');
 
 module.exports = {
-  ...baseConfiguration,
-  plugins: [
-    ...baseConfiguration.plugins.filter(
-      plugin => plugin.constructor.name !== 'DependencyExtractionWebpackPlugin'
-    ),
-    new DependencyExtractionWebpackPlugin({
-      outputFormat: 'json',
-    }),
-  ],
-  resolve: {
-    extensions: ['.ts', '.tsx'],
-    alias: {
-      '@entities-search': path.resolve(__dirname, 'sources/js/src'),
-      '@types': path.resolve(__dirname, 'sources/js/src/@types'),
-    },
-  },
-}
+	...baseConfiguration,
+	plugins: [
+		...baseConfiguration.plugins.filter(
+			(plugin) =>
+				plugin.constructor.name !== 'DependencyExtractionWebpackPlugin'
+		),
+		new DependencyExtractionWebpackPlugin({
+			outputFormat: 'json',
+		}),
+	],
+	resolve: {
+		extensions: ['.ts', '.tsx'],
+		alias: {
+			'@entities-search': path.resolve(__dirname, 'sources/js/src'),
+			'@entities-search-types': path.resolve(
+				__dirname,
+				'sources/js/src/@types'
+			),
+		},
+	},
+};