chore: migrate from yarn v1 to pnpm and use corepack (#129)

BREAKING CHANGE: Change build target from ES5 to ES2020 (technically, this isn't necessary, but for consistency) * chore: migrate from yarn v1 to pnpm and use corepack * chore: add dpes as workspace:* * chore: enable corepack pnpm on CI * fix: version number * fix: corepack command * pre-enable corepack * fix: incorrect yaml format * chore: update tsc target * chore: update tsc lib * fix: pass build scripts * fix: add useWorkspaces option for lerna * fix: update pnpm lock file * update pnpm lock file for demo apps * fix: lint errors * fix: use config.cache and igoore a tserror temporarily * refactor: use import type
koba04 · Nov 24, 2023 · 810b914 · 810b914 · vercel · Nov 24, 2023
1 parent 48bf954
commit 810b914
Show file tree

Hide file tree

Showing 28 changed files with 10,980 additions and 10,168 deletions.
diff --git a/.github/workflows/lint.yml b/.github/workflows/lint.yml
@@ -20,12 +20,15 @@ jobs:
         # See supported Node.js release schedule at https://nodejs.org/en/about/releases/
 
     steps:
-    - uses: actions/checkout@v2
+    - uses: actions/checkout@v4
+    # https://github.com/actions/setup-node/issues/531#issuecomment-1241495144
+    - name: Enable Corepack
+      run: corepack enable
     - name: Use Node.js ${{ matrix.node-version }}
-      uses: actions/setup-node@v2
+      uses: actions/setup-node@v4
       with:
         node-version: ${{ matrix.node-version }}
-        cache: 'yarn'
-    - run: yarn install
-    - run: yarn build
-    - run: yarn lint
+        cache: 'pnpm'
+    - run: pnpm install
+    - run: pnpm build
+    - run: pnpm lint
diff --git a/.github/workflows/test.yml b/.github/workflows/test.yml
@@ -20,12 +20,15 @@ jobs:
         # See supported Node.js release schedule at https://nodejs.org/en/about/releases/
 
     steps:
-    - uses: actions/checkout@v2
+    - uses: actions/checkout@v4
+    # https://github.com/actions/setup-node/issues/531#issuecomment-1241495144
+    - name: Enable Corepack
+      run: corepack enable
     - name: Use Node.js ${{ matrix.node-version }}
-      uses: actions/setup-node@v2
+      uses: actions/setup-node@v4
       with:
         node-version: ${{ matrix.node-version }}
-        cache: 'yarn'
-    - run: yarn install
-    - run: yarn build
-    - run: yarn test
+        cache: 'pnpm'
+    - run: pnpm install
+    - run: pnpm build
+    - run: pnpm test
diff --git a/CONTRIBUTING.md b/CONTRIBUTING.md
@@ -7,8 +7,8 @@ Thank you for your contributions!
 ### Develop `swr-devtools-panel`
 
 ```
-$ yarn install
-$ yarn start
+$ pnpm install
+$ pnpm start
 ```
 
 And then, open http://localhost:3000/.
@@ -22,4 +22,4 @@ See more details on https://developer.chrome.com/docs/extensions/mv3/getstarted/
 
 #### Firefox
 
-After the instruction of "Develop `swr-devtools-panel`", run `yarn workspace swr-devtools-extensions start:firefox`.
+After the instruction of "Develop `swr-devtools-panel`", run `pnpm --filter swr-devtools-extensions start:firefox`.
diff --git a/examples/swr-devtools-demo/app/debug/infinite/page.tsx b/examples/swr-devtools-demo/app/debug/infinite/page.tsx
@@ -80,7 +80,8 @@ const sleep = (ms: number) =>
 const fetcher = async (url) => {
   await sleep(Math.random() * 2000);
   const searchParams = new URL(location.origin + url).searchParams;
-  return dummyData[searchParams.get("page")] || [];
+  const page = searchParams.get("page");
+  return page !== null && dummyData[page] ? dummyData[page] : [];
 };
 
 export default function Home() {

diff --git a/examples/swr-devtools-demo/next-env.d.ts b/examples/swr-devtools-demo/next-env.d.ts
@@ -1,5 +1,6 @@
 /// <reference types="next" />
 /// <reference types="next/image-types/global" />
+/// <reference types="next/navigation-types/compat/navigation" />
 
 // NOTE: This file should not be edited
 // see https://nextjs.org/docs/basic-features/typescript for more information.
diff --git a/examples/swr-devtools-demo/package.json b/examples/swr-devtools-demo/package.json
@@ -15,10 +15,13 @@
     "react-dom": "18.2.0",
     "styled-components": "^5.3.5",
     "sugar-high": "^0.4.6",
-    "swr": "^2.0.0"
+    "swr": "^2.0.0",
+    "swr-devtools": "workspace:*",
+    "swr-devtools-panel": "workspace:*"
   },
   "devDependencies": {
     "@types/node": "^18.7.18",
-    "babel-plugin-styled-components": "^2.0.7"
+    "babel-plugin-styled-components": "^2.0.7",
+    "typescript": "^4.8.3"
   }
 }
diff --git a/examples/swr-devtools-demo/pages/_document.tsx b/examples/swr-devtools-demo/pages/_document.tsx
@@ -10,7 +10,6 @@ export default class MyDocument extends Document {
       ctx.renderPage = () =>
         originalRenderPage({
           enhanceApp: (App) => (props) =>
-            // @ts-expect-error
             sheet.collectStyles(<App {...props} />),
         });
 

diff --git a/examples/swr-devtools-demo/pages/infinite.tsx b/examples/swr-devtools-demo/pages/infinite.tsx
@@ -80,7 +80,8 @@ const sleep = (ms: number) =>
 const fetcher = async (url) => {
   await sleep(Math.random() * 2000);
   const searchParams = new URL(location.origin + url).searchParams;
-  return dummyData[searchParams.get("page")] || [];
+  const page = searchParams.get("page");
+  return page !== null && dummyData[page] ? dummyData[page] : [];
 };
 
 export default function Home() {

diff --git a/examples/swr-devtools-demo/tsconfig.json b/examples/swr-devtools-demo/tsconfig.json
@@ -22,7 +22,8 @@
       {
         "name": "next"
       }
-    ]
+    ],
+    "strictNullChecks": true
   },
   "include": [
     "next-env.d.ts",

diff --git a/examples/swr-v1-devtools-demo/package.json b/examples/swr-v1-devtools-demo/package.json
@@ -14,10 +14,13 @@
     "react-dom": "18.2.0",
     "styled-components": "^5.3.5",
     "sugar-high": "^0.4.6",
-    "swr": "^1.3.0"
+    "swr": "^1.3.0",
+    "swr-devtools": "workspace:*",
+    "swr-devtools-panel": "workspace:*"
   },
   "devDependencies": {
     "@types/node": "^18.7.18",
-    "babel-plugin-styled-components": "^2.0.7"
+    "babel-plugin-styled-components": "^2.0.7",
+    "typescript": "^4.8.3"
   }
 }
diff --git a/examples/swr-v1-devtools-demo/pages/_document.tsx b/examples/swr-v1-devtools-demo/pages/_document.tsx
@@ -10,7 +10,6 @@ export default class MyDocument extends Document {
       ctx.renderPage = () =>
         originalRenderPage({
           enhanceApp: (App) => (props) =>
-            // @ts-expect-error
             sheet.collectStyles(<App {...props} />),
         });
 

diff --git a/examples/swr-v1-legacy-devtools-demo/package.json b/examples/swr-v1-legacy-devtools-demo/package.json
@@ -14,10 +14,13 @@
     "react-dom": "18.2.0",
     "styled-components": "^5.3.5",
     "sugar-high": "^0.4.6",
-    "swr": "1.1.x"
+    "swr": "1.1.x",
+    "swr-devtools": "workspace:*",
+    "swr-devtools-panel": "workspace:*"
   },
   "devDependencies": {
     "@types/node": "^18.7.18",
-    "babel-plugin-styled-components": "^2.0.7"
+    "babel-plugin-styled-components": "^2.0.7",
+    "typescript": "^4.8.3"
   }
 }
diff --git a/examples/swr-v1-legacy-devtools-demo/pages/_app.tsx b/examples/swr-v1-legacy-devtools-demo/pages/_app.tsx
@@ -13,6 +13,7 @@ const fetcher = async (url) => {
 
 function MyApp({ Component, pageProps }) {
   return (
+    // @ts-expect-error roperty 'children' does not exist on type 'IntrinsicAttributes & { value?: Partial<PublicConfiguration<any, any, BareFetcher<any>>> & Partial<ProviderConfiguration> & { ...; }; }'.
     <SWRConfig value={{ fetcher }}>
       <SWRDevTools>
         <Component {...pageProps} />

diff --git a/examples/swr-v1-legacy-devtools-demo/pages/_document.tsx b/examples/swr-v1-legacy-devtools-demo/pages/_document.tsx
@@ -10,7 +10,6 @@ export default class MyDocument extends Document {
       ctx.renderPage = () =>
         originalRenderPage({
           enhanceApp: (App) => (props) =>
-            // @ts-expect-error
             sheet.collectStyles(<App {...props} />),
         });
 

diff --git a/lerna.json b/lerna.json
@@ -1,7 +1,8 @@
 {
-  "npmClient": "yarn",
+  "npmClient": "pnpm",
   "packages": [
     "packages/*"
   ],
+  "useWorkspaces": true,
   "version": "1.3.2"
 }
diff --git a/package.json b/package.json
@@ -8,29 +8,30 @@
   ],
   "scripts": {
     "build": "run-s build:devtools build:panel build:extensions",
-    "build:devtools": "yarn workspace swr-devtools build",
-    "build:demo": "yarn workspace swr-devtools-demo build",
-    "build:extensions": "yarn workspace swr-devtools-extensions build",
-    "build:panel": "yarn workspace swr-devtools-panel build",
+    "build:devtools": "pnpm --filter \"swr-devtools\" build",
+    "build:demo": "pnpm --filter \"swr-devtools-demo\" build",
+    "build:extensions": "pnpm --filter \"swr-devtools-extensions\" build",
+    "build:panel": "pnpm --filter \"swr-devtools-panel\" build",
     "deploy:demo": "run-s build:devtools build:panel build:demo",
     "prerelease": "run-s build lint",
     "release": "lerna publish --conventional-commits",
-    "start:demo": "yarn workspace swr-devtools-demo dev",
-    "start:dev": "yarn workspace swr-devtools start",
-    "start:panel": "yarn workspace swr-devtools-panel start",
+    "start:demo": "pnpm --filter swr-devtools-demo dev",
+    "start:dev": "pnpm --filter swr-devtools start",
+    "start:panel": "pnpm --filter swr-devtools-panel start",
     "start": "run-p -l start:*",
-    "v1": "yarn workspace swr-v1-devtools-demo dev",
-    "v1-legacy": "yarn workspace swr-v1-legacy-devtools-demo dev",
+    "v1": "pnpm --filter swr-v1-devtools-demo dev",
+    "v1-legacy": "pnpm --filter swr-v1-legacy-devtools-demo dev",
     "lint:eslint": "eslint '**/pages/**/*' '**/src/**/*'",
-    "lint:tsc": "yarn workspaces run lint",
+    "lint:tsc": "pnpm -r lint",
     "lint": "run-p -l lint:*",
     "test": "run-p -l test:*",
-    "test:panel": "yarn workspace swr-devtools-panel test",
-    "test:devtools": "yarn workspace swr-devtools test"
+    "test:panel": "pnpm --filter swr-devtools-panel test",
+    "test:devtools": "pnpm --filter swr-devtools test"
   },
   "repository": "ssh://[email protected]/koba04/swr-devtools.git",
   "author": "Toru Kobayashi <[email protected]>",
   "license": "MIT",
+  "packageManager": "[email protected]",
   "devDependencies": {
     "@cybozu/eslint-config": "^17.0.3",
     "eslint": "^8.23.1",

diff --git a/packages/swr-devtools-extensions/package.json b/packages/swr-devtools-extensions/package.json
@@ -5,7 +5,7 @@
   "main": "lib/index.js",
   "license": "MIT",
   "scripts": {
-    "prebuild": "yarn clean",
+    "prebuild": "pnpm clean",
     "build:zip:chrome": "cd dist && zip -r ../extension.zip * && cd ../",
     "build:webpack:chrome": "webpack --mode production",
     "build:chrome": "run-s build:webpack:chrome build:zip:chrome",
@@ -37,8 +37,8 @@
     "react-dom": "^18.2.0",
     "styled-components": "^5.3.5",
     "swr": "^2.0.0",
-    "swr-devtools": "^1.3.2",
-    "swr-devtools-panel": "^1.3.2",
+    "swr-devtools": "workspace:*",
+    "swr-devtools-panel": "workspace:*",
     "webextension-polyfill": "^0.10.0"
   }
 }
diff --git a/packages/swr-devtools-extensions/tsconfig.json b/packages/swr-devtools-extensions/tsconfig.json
@@ -4,9 +4,9 @@
 
     /* Basic Options */
     // "incremental": true,                   /* Enable incremental compilation */
-    "target": "es2017",                          /* Specify ECMAScript target version: 'ES3' (default), 'ES5', 'ES2015', 'ES2016', 'ES2017', 'ES2018', 'ES2019', 'ES2020', or 'ESNEXT'. */
+    "target": "es2020",                          /* Specify ECMAScript target version: 'ES3' (default), 'ES5', 'ES2015', 'ES2016', 'ES2017', 'ES2018', 'ES2019', 'ES2020', or 'ESNEXT'. */
     "module": "es2020",                     /* Specify module code generation: 'none', 'commonjs', 'amd', 'system', 'umd', 'es2015', 'es2020', or 'ESNext'. */
-    "lib": ["es2017", "DOM"],                             /* Specify library files to be included in the compilation. */
+    "lib": ["es2020", "DOM"],                             /* Specify library files to be included in the compilation. */
     // "allowJs": true,                       /* Allow javascript files to be compiled. */
     // "checkJs": true,                       /* Report errors in .js files. */
     "jsx": "react-jsx",                     /* Specify JSX code generation: 'preserve', 'react-native', or 'react'. */

diff --git a/packages/swr-devtools-panel/README.md b/packages/swr-devtools-panel/README.md
@@ -9,8 +9,8 @@ This package is a React component of SWR Devtools panel. If you want to use this
 
 ```
 // install peerDependencies
-$ yarn add react swr styled-components
-$ yarn add swr-devtools-panel
+$ pnpm add react swr styled-components
+$ pnpm add swr-devtools-panel
 ```
 
 ## How to use

diff --git a/packages/swr-devtools-panel/package.json b/packages/swr-devtools-panel/package.json
@@ -24,7 +24,7 @@
     "start": "run-p start:*",
     "start:cjs": "tsc -p tsconfig.cjs.json --watch",
     "start:esm": "tsc --watch",
-    "prebuild": "yarn clean",
+    "prebuild": "pnpm clean",
     "build": "run-p build:*",
     "build:esm": "tsc",
     "build:cjs": "tsc -p tsconfig.cjs.json",
@@ -52,6 +52,6 @@
   },
   "dependencies": {
     "react-json-tree": "^0.17.0",
-    "swr-devtools": "^1.3.2"
+    "swr-devtools": "workspace:*"
   }
 }
diff --git a/packages/swr-devtools-panel/src/components/SWRDevToolPanel.tsx b/packages/swr-devtools-panel/src/components/SWRDevToolPanel.tsx
@@ -73,7 +73,6 @@ const GlobalStyleSheet = createGlobalStyle<{ theme: Theme }>`${({ theme }) => `
 
 const GlobalStyle = () => {
   const theme = useTheme();
-  // @ts-expect-error https://github.com/styled-components/styled-components/issues/3738
   return <GlobalStyleSheet theme={theme} />;
 };
 

diff --git a/packages/swr-devtools-panel/tsconfig.json b/packages/swr-devtools-panel/tsconfig.json
@@ -4,9 +4,9 @@
 
     /* Basic Options */
     // "incremental": true,                   /* Enable incremental compilation */
-    "target": "es5",                          /* Specify ECMAScript target version: 'ES3' (default), 'ES5', 'ES2015', 'ES2016', 'ES2017', 'ES2018', 'ES2019', 'ES2020', or 'ESNEXT'. */
+    "target": "es2020",                          /* Specify ECMAScript target version: 'ES3' (default), 'ES5', 'ES2015', 'ES2016', 'ES2017', 'ES2018', 'ES2019', 'ES2020', or 'ESNEXT'. */
     "module": "es2020",                     /* Specify module code generation: 'none', 'commonjs', 'amd', 'system', 'umd', 'es2015', 'es2020', or 'ESNext'. */
-    "lib": ["dom", "es2017"],                             /* Specify library files to be included in the compilation. */
+    "lib": ["dom", "es2020"],                             /* Specify library files to be included in the compilation. */
     // "allowJs": true,                       /* Allow javascript files to be compiled. */
     // "checkJs": true,                       /* Report errors in .js files. */
     "jsx": "react",                     /* Specify JSX code generation: 'preserve', 'react-native', or 'react'. */

diff --git a/packages/swr-devtools/package.json b/packages/swr-devtools/package.json
@@ -43,7 +43,7 @@
     "start": "run-p start:*",
     "start:cjs": "tsc -p tsconfig.cjs.json --watch",
     "start:esm": "tsc --watch",
-    "prebuild": "yarn clean",
+    "prebuild": "pnpm clean",
     "build": "run-p build:*",
     "build:esm": "tsc",
     "build:cjs": "tsc -p tsconfig.cjs.json",

diff --git a/packages/swr-devtools/src/createSWRDevTools.ts b/packages/swr-devtools/src/createSWRDevTools.ts
@@ -129,6 +129,7 @@ export const createSWRDevtools = () => {
 
     // FIXME: I'll use mutate to support mutating from a devtool panel.
     // const { cache /* , mutate */ } = useSWRConfig();
+    // @ts-expect-error
     const cache = config.cache;
 
     if (!injected.has(cache)) {
@@ -190,7 +191,12 @@ export const createSWRDevtools = () => {
           );
           try {
             const res = fn(...args);
-            if (res && "then" in res && typeof res.then === "function") {
+            if (
+              res &&
+              typeof res === "object" &&
+              "then" in res &&
+              typeof res.then === "function"
+            ) {
               return res
                 .then((r) => {
                   requestIdRef.current = id;

diff --git a/packages/swr-devtools/tsconfig.json b/packages/swr-devtools/tsconfig.json
@@ -4,9 +4,9 @@
 
     /* Basic Options */
     // "incremental": true,                   /* Enable incremental compilation */
-    "target": "es5",                          /* Specify ECMAScript target version: 'ES3' (default), 'ES5', 'ES2015', 'ES2016', 'ES2017', 'ES2018', 'ES2019', 'ES2020', or 'ESNEXT'. */
+    "target": "es2020",                          /* Specify ECMAScript target version: 'ES3' (default), 'ES5', 'ES2015', 'ES2016', 'ES2017', 'ES2018', 'ES2019', 'ES2020', or 'ESNEXT'. */
     "module": "es2020",                     /* Specify module code generation: 'none', 'commonjs', 'amd', 'system', 'umd', 'es2015', 'es2020', or 'ESNext'. */
-    "lib": ["dom", "es2017"],                             /* Specify library files to be included in the compilation. */
+    "lib": ["dom", "es2020"],                             /* Specify library files to be included in the compilation. */
     // "allowJs": true,                       /* Allow javascript files to be compiled. */
     // "checkJs": true,                       /* Report errors in .js files. */
     "jsx": "react",                     /* Specify JSX code generation: 'preserve', 'react-native', or 'react'. */