Merge pull request #141 from hiroki0525/improve

Improve

.github/actions/setup/action.yml

@@ -0,0 +1,19 @@
+name: Setup
+description: "Setup Node.js, pnpm and dependencies"
+
+runs:
+  using: "composite"
+  steps:
+    - name: Setup pnpm
+      uses: pnpm/action-setup@v2
+    - name: Setup Node
+      uses: actions/setup-node@v4
+      with:
+        node-version-file: '.node-version'
+        cache: 'pnpm'
+    - name: Install Dependencies
+      run: pnpm i -r --frozen-lockfile
+      shell: bash
+    - name: Build
+      run: pnpm build
+      shell: bash

.github/workflows/check-bundle-size.yml

@@ -12,15 +12,8 @@ jobs:
     timeout-minutes: 180
     steps:
       - name: Checkout
-        uses: actions/checkout@v3
-      - name: Setup Node
-        uses: actions/setup-node@v3
-        with:
-          node-version-file: '.node-version'
-      - name: Install Dependencies
-        run: npm ci
-      - name: Build
-        run: npm run build
+        uses: actions/checkout@v4
+      - uses: ./.github/actions/setup
       - name: Run BundleMon
         run: ./node_modules/.bin/bundlemon
         env:

.github/workflows/release.yml

@@ -11,15 +11,8 @@ jobs:
     timeout-minutes: 180
     steps:
       - name: Checkout
-        uses: actions/checkout@v3
-      - name: Setup Node
-        uses: actions/setup-node@v3
-        with:
-          node-version-file: '.node-version'
-      - name: Install Dependencies
-        run: npm ci
-      - name: Build
-        run: npm run build
+        uses: actions/checkout@v4
+      - uses: ./.github/actions/setup
       - name: Deploy Package
         env:
           NPM_TOKEN: ${{secrets.NPM_TOKEN}}
@@ -32,4 +25,4 @@ jobs:
           git config --global user.email "$GIT_EMAIL"
           git config --global user.name "hiroki0525"
       - name: Deploy Examples
-        run: npm run deploy:examples
+        run: pnpm deploy:examples

.github/workflows/test.yml

@@ -12,15 +12,8 @@ jobs:
     timeout-minutes: 180
     steps:
       - name: Checkout
-        uses: actions/checkout@v3
-      - name: Setup Node
-        uses: actions/setup-node@v3
-        with:
-          node-version-file: '.node-version'
-      - name: Install Dependencies
-        run: npm ci
+        uses: actions/checkout@v4
+      - uses: ./.github/actions/setup
       - name: Test
         run: |
-          npm run test && npm run lint && npm run prettier
-      - name: Build
-        run: npm run build
+          pnpm t && pnpm lint && pnpm prettier

.node-version

@@ -1 +1 @@
-18.12.1
+20.11.1

.npmrc

@@ -0,0 +1 @@
+enable-pre-post-scripts=true

examples/index.tsx

@@ -20,11 +20,7 @@ const App = () => (
   </StrictMode>
 );
 
-const rootElement = document.getElementById('root');
-
-if (!rootElement) {
-  throw new Error('root element cannot be found.');
-}
+const rootElement = document.getElementById('root')!;
 
 const root = createRoot(rootElement);
 

examples/package.json

@@ -5,30 +5,31 @@
  "main": "index.tsx",
  "scripts": {
   "start": "webpack-dev-server --mode=development",
-  "build": "npm run clean && webpack --mode=production",
-  "deploy": "npm run build && gh-pages -d dist",
+  "build": "pnpm clean && webpack --mode=production",
+  "deploy": "pnpm build && gh-pages -d dist",
   "clean": "rm -rf dist"
  },
  "author": "Hiroki Miyaji <[email protected]>",
  "license": "ISC",
  "devDependencies": {
-  "autoprefixer": "^10.4.7",
-  "css-loader": "^6.7.1",
+  "autoprefixer": "^10.4.18",
+  "css-loader": "^6.10.0",
   "file-loader": "^6.2.0",
-  "gh-pages": "^4.0.0",
-  "html-webpack-plugin": "^5.5.0",
-  "postcss": "^8.4.13",
-  "postcss-loader": "^7.0.1",
-  "style-loader": "^3.3.1",
-  "tailwindcss": "^3.0.24",
-  "ts-loader": "^9.2.8",
+  "gh-pages": "^6.1.1",
+  "html-webpack-plugin": "^5.6.0",
+  "postcss": "^8.4.35",
+  "postcss-loader": "^8.1.1",
+  "style-loader": "^3.3.4",
+  "tailwindcss": "^3.4.1",
+  "ts-loader": "^9.5.1",
   "url-loader": "^4.1.1",
-  "web-vitals": "^3.0.4",
-  "webpack": "^5.71.0",
-  "webpack-cli": "^4.9.2",
-  "webpack-dev-server": "^4.7.4"
+  "web-vitals": "^3.5.2",
+  "webpack": "^5.90.3",
+  "webpack-cli": "^5.1.4",
+  "webpack-dev-server": "^5.0.2"
  },
  "dependencies": {
-  "react-router-dom": "^6.3.0"
+  "react-router-dom": "^6.22.3",
+  "react-dom-lazyload-component": "workspace:*"
  }
 }

examples/tsconfig.json

@@ -0,0 +1,4 @@
+{
+  "extends": "../tsconfig.json",
+  "include": ["./src/**/*"]
+}

jest-puppeteer.config.js

@@ -1,6 +1,6 @@
 module.exports = {
   server: {
-    command: 'npm run start:examples:ci',
+    command: 'pnpm start:examples',
     port: 3001,
     host: 'localhost',
     protocol: 'http',