Merge pull request #14 from MiracleUFO/fix-build/build-error

Fix build/build error
MiracleUFO · Oct 5, 2023 · 878d2cd · 878d2cd
2 parents 9eaa28e + ee6b6df
commit 878d2cd
Show file tree

Hide file tree

Showing 6 changed files with 1,600 additions and 608 deletions.
diff --git a/package-lock.json b/package-lock.json
diff --git a/package.json b/package.json
@@ -2,28 +2,20 @@
   "name": "@miracleufo/react-g-translator",
   "version": "1.0.0",
   "description": "A modern, free, lightweight npm package for translating react apps (component wrapper.) No API keys or language list files are required.",
-  "exports": {
-    ".": {
-      "import": {
-        "types": "./lib/esm/types/index.d.ts",
-        "default": "./lib/esm/index.mjs"
-      },
-      "require": {
-        "types": "./lib/cjs/types/index.d.ts",
-        "default": "./lib/cjs/index.js"
-      }
-    }
-  },
-  "types": "./lib/cjs/types/index.d.ts",
-  "main": "./lib/cjs/index.js",
+  "author": "Miracle Ufodiama",
+  "license": "MIT",
+  "main": "dist/index.js",
+  "module": "dist/index.esm.js",
+  "unpkg": "dist/index.min.js",
+  "types": "dist/index.d.ts",
   "files": [
-    "lib/**/*"
+    "dist",
+    "src",
+    "tsconfig.json"
   ],
   "scripts": {
-    "clean": "rm -rf ./lib",
-    "build": "npm run clean && npm run build:esm && npm run build:cjs",
-    "build:esm": "tsc -p ./configs/tsconfig.esm.json && mv lib/esm/index.js lib/esm/index.mjs",
-    "build:cjs": "tsc -p ./configs/tsconfig.cjs.json",
+    "clean": "rimraf dist",
+    "build": "npm run clean && rollup -c",
     "semantic-release": "semantic-release",
     "test": "env-cmd -f .env.development react-scripts test --runInBand --no-cache",
     "prepack": "npm run build",
@@ -47,17 +39,25 @@
     "typescript",
     "esm",
     "cjs",
+    "umd",
+    "react",
     "nodejs",
     "commonjs",
     "ecmascript",
     "beginner",
-    "example",
-    "demonstration"
+    "demonstration",
+    "localisation",
+    "accessibility",
+    "a11y",
+    "internationalisation",
+    "i18n"
   ],
-  "author": "Miracle Ufodiama",
-  "license": "MIT",
   "devDependencies": {
     "@babel/plugin-proposal-private-property-in-object": "^7.21.11",
+    "@rollup/plugin-commonjs": "^25.0.5",
+    "@rollup/plugin-json": "^6.0.1",
+    "@rollup/plugin-terser": "^0.4.4",
+    "@rollup/plugin-typescript": "^11.1.5",
     "@types/crypto-js": "^4.1.2",
     "@types/google-translate-api": "^2.3.2",
     "@types/jest": "^29.5.4",
@@ -83,6 +83,11 @@
     "jsdom": "20.0.3",
     "jsdom-global": "3.0.2",
     "prettier": "^3.0.3",
+    "rimraf": "^5.0.5",
+    "rollup": "^3.29.4",
+    "rollup-plugin-dts": "^6.0.2",
+    "rollup-plugin-peer-deps-external": "^2.2.4",
+    "rollup-plugin-polyfill-node": "^0.12.0",
     "semantic-release": "^21.1.1",
     "ts-node": "^10.9.1"
   },
@@ -97,6 +102,7 @@
     }
   },
   "dependencies": {
+    "@rollup/plugin-node-resolve": "^15.2.2",
     "@testing-library/jest-dom": "^6.1.3",
     "@testing-library/react": "^14.0.0",
     "@testing-library/user-event": "^14.5.0",
@@ -105,10 +111,14 @@
     "env-cmd": "^10.1.0",
     "https-proxy-agent": "^7.0.2",
     "lodash": "^4.17.21",
-    "react": "^18.2.0",
+    "react": "^16.8.0 || ^17.0.0 || ^18.0.0",
     "react-dom": "^18.2.0",
     "react-query": "^3.39.2",
     "react-scripts": "5.0.1",
     "typescript": "^4.9.5"
+  },
+  "peerDependencies": {
+    "react": "^16.8.0 || ^17.0.0 || ^18.0.0",
+    "react-dom": "^18.2.0"
   }
 }
diff --git a/rollup.config.mjs b/rollup.config.mjs
@@ -0,0 +1,73 @@
+/* eslint-disable import/no-extraneous-dependencies */
+// @ts-check
+
+/* eslint-env node */
+import commonjs from '@rollup/plugin-commonjs';
+import { nodeResolve } from '@rollup/plugin-node-resolve';
+import nodePolyfills from 'rollup-plugin-polyfill-node';
+import peerDepsExternal from 'rollup-plugin-peer-deps-external';
+import typescript from '@rollup/plugin-typescript';
+import terser from '@rollup/plugin-terser';
+import dts from 'rollup-plugin-dts';
+import json from '@rollup/plugin-json';
+
+/**
+ * Rollup configuration to build the main bundle.
+ * @type {import('rollup').RollupOptions}
+ */
+const mainConfig = {
+  input: 'src/index.ts',
+  output: [
+    {
+      file: 'dist/index.esm.js',
+      format: 'esm',
+      sourcemap: true,
+    },
+    {
+      file: 'dist/index.js',
+      format: 'cjs',
+      sourcemap: true,
+    },
+    {
+      file: 'dist/index.min.js',
+      format: 'umd',
+      name: 'DatePicker',
+      plugins: [terser()],
+      sourcemap: true,
+      globals: {
+        react: 'React',
+      },
+    },
+  ],
+  external: ['react', 'react-dom'],
+  plugins: [
+    peerDepsExternal(),
+    nodeResolve(),
+    commonjs(),
+    json(),
+    typescript({
+      tsconfig: './tsconfig.build.json',
+      declaration: false,
+    }),
+    nodePolyfills(),
+  ],
+};
+
+/**
+ * Rollup configuration to build the type declaration file.
+ * @type {import('rollup').RollupOptions}
+ */
+export const dtsConfig = {
+  input: 'src/index.ts',
+  output: [{ file: 'dist/index.d.ts', format: 'es' }],
+  plugins: [
+    dts({
+      tsconfig: './tsconfig.build.json',
+      compilerOptions: {
+        preserveSymlinks: false,
+      },
+    }),
+  ],
+};
+
+export default [mainConfig, dtsConfig];
diff --git a/src/components/Translator.tsx b/src/components/Translator.tsx
@@ -1,4 +1,6 @@
+/* eslint-disable react/jsx-no-useless-fragment */
 import React, {
+  JSX,
   ReactNode,
   ReactElement,
   Children,
@@ -35,7 +37,6 @@ const Translation = ({
     isError,
     isLoading,
   );
-  // eslint-disable-next-line react/jsx-no-useless-fragment
   return <>{translatedText}</>;
 };
 
@@ -79,14 +80,14 @@ const Translator = ({
   to,
   shouldFallback,
 }: {
-  children: ReactNode;
+  children: ReactNode | React.ReactElement<any, any> | Element | JSX.Element;
   from?: language;
   to?: language;
   shouldFallback?: boolean;
 }) => (
   <QueryClientProvider client={queryClient}>
     <LanguageProvider>
-      {recursivelyTranslate(children, from, to, shouldFallback)}
+      {recursivelyTranslate(<>{children}</>, from, to, shouldFallback)}
     </LanguageProvider>
   </QueryClientProvider>
 );

diff --git a/tsconfig.build.json b/tsconfig.build.json
@@ -0,0 +1,8 @@
+{
+  "extends": "./tsconfig.json",
+  "compilerOptions": {
+    "rootDir": "./src"
+  },
+  "exclude": ["**/*.test.*"],
+  "include": ["./src/**/*"]
+}
diff --git a/tsconfig.json b/tsconfig.json
@@ -2,7 +2,10 @@
   "compilerOptions": {
     "jsx": "react-jsx",
     "strict": true,
-    "esModuleInterop": true
+    "esModuleInterop": true,
+    "target": "es5",
+    "module": "esnext",
+    "moduleResolution": "node",
   },
   "include": [
     "*.eslintrc.js",