chore: improve configs, dockerfile, ci and pnpm workspace

.dockerignore

@@ -0,0 +1,11 @@
+node_modules
+Dockerfile
+compose.yaml
+.git
+.gitignore
+*.md
+dist
+.github
+.vscode
+.next
+lib/lib

.editorconfig

@@ -0,0 +1,12 @@
+# EditorConfig is awesome: https://EditorConfig.org
+
+# top-most EditorConfig file
+root = true
+
+[*]
+end_of_line = lf
+insert_final_newline = true
+indent_style = space
+indent_size = 2
+charset = utf-8
+trim_trailing_whitespace = true

.eslintrc.json

@@ -1,4 +1,5 @@
 {
+  "root": true,
   "env": {
     "browser": true,
     "es2021": true,
@@ -7,10 +8,10 @@
   },
   "extends": [
     "eslint:recommended",
+    "plugin:react/recommended",
     "plugin:react/jsx-runtime",
     "plugin:@typescript-eslint/recommended",
-    "prettier",
-    "plugin:prettier/recommended"
+    "prettier"
   ],
   "parser": "@typescript-eslint/parser",
   "parserOptions": {
@@ -20,7 +21,7 @@
     },
     "sourceType": "module"
   },
-  "plugins": ["react", "@typescript-eslint"],
+  "plugins": ["@typescript-eslint"],
   "rules": {
     "react/display-name": "off"
   },
@@ -29,5 +30,5 @@
       "version": "detect"
     }
   },
-  "ignorePatterns": ["node_modules/", "dist/", "lib/", ".next/"]
+  "ignorePatterns": ["node_modules", "dist", "lib/lib", ".next"]
 }

.github/workflows/test.yml

@@ -11,17 +11,23 @@ jobs:
     name: Run tests with Node.js ${{ matrix.node-version }}
 
     steps:
-      - uses: actions/checkout@v3
-      - uses: pnpm/action-setup@v2
+      - name: Checkout
+        uses: actions/checkout@v4
+
+      - name: Install pnpm
+        uses: pnpm/action-setup@v3
         with:
           version: 8
-      - uses: actions/setup-node@v3
 
+      - name: Setup node
+        uses: actions/setup-node@v4
         with:
           node-version: ${{ matrix.node-version }}
           cache: "pnpm"
+
       - run: pnpm config --global set dedupe-peer-dependents=false
       - run: pnpm --filter=react-esi install
+      - run: pnpm --filter=react-esi run lint
+      - run: pnpm --filter=react-esi run typecheck
       - run: pnpm --filter=react-esi run build
       - run: pnpm --filter=react-esi run test
-      - run: pnpm --filter=react-esi run lint

.gitignore

@@ -1,5 +1,37 @@
+# See https://help.github.com/articles/ignoring-files/ for more about ignoring files.
+
+# dependencies
 node_modules
-/coverage
+.pnp
+.pnp.js
+.pnpm-store
+
+# testing
+coverage
+
+# next.js
+.next/
+out/
+
+# production
+build
 dist
 lib/lib
-.pnpm-store
+
+# misc
+.DS_Store
+*.pem
+
+# debug
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+
+# local env files
+.env*.local
+
+# vercel
+.vercel
+
+# typescript
+*.tsbuildinfo

.npmrc

@@ -0,0 +1 @@
+link-workspace-packages=false

.prettierignore

@@ -4,4 +4,4 @@
 **/node_modules
 **/.next
 **/dist
-**/lib/lib
+/lib/lib

.prettierrc.json

@@ -1,7 +1,3 @@
 {
-  "printWidth": 80,
-  "endOfLine": "auto",
-  "semi": true,
-  "singleQuote": false,
-  "trailingComma": "none"
+  "trailingComma": "es5"
 }

.vscode/extensions.json

@@ -0,0 +1,7 @@
+{
+  "recommendations": [
+    "dbaeumer.vscode-eslint",
+    "esbenp.prettier-vscode",
+    "orta.vscode-jest"
+  ]
+}

.vscode/settings.json

@@ -0,0 +1,21 @@
+{
+  "jest.outputConfig": {
+    "clearOnRun": "none",
+    "revealOn": "demand",
+    "revealWithFocus": "none"
+  },
+  "testing.openTesting": "neverOpen",
+  "eslint.workingDirectories": ["lib/", "examples/express/", "examples/next/"],
+  "editor.codeActionsOnSave": {
+    "source.eslint.fixAll": "explicit",
+    "source.fixAll": "explicit"
+  },
+  "editor.formatOnSave": true,
+  "editor.defaultFormatter": "esbenp.prettier-vscode",
+  "eslint.validate": [
+    "javascript",
+    "javascriptreact",
+    "typescript",
+    "typescriptreact"
+  ]
+}

Dockerfile

@@ -1,31 +1,74 @@
-FROM node:20 AS base
+FROM node:20-slim AS base
 ENV PNPM_HOME="/pnpm"
 ENV PATH="$PNPM_HOME:$PATH"
-RUN corepack enable
-COPY . /app
-WORKDIR /app
+RUN corepack enable pnpm
 
-FROM base AS prod-deps
-RUN --mount=type=cache,id=pnpm,target=/pnpm/store pnpm install --prod --frozen-lockfile
 
-FROM base AS build
+# Express
+FROM base AS deps-express
+WORKDIR /home/node/repo
+
+COPY ./package.json ./pnpm-lock.yaml ./pnpm-workspace.yaml ./
+COPY ./examples/express/package.json ./examples/express/
+COPY ./lib/package.json ./lib/
+RUN --mount=type=cache,id=pnpm,target=/pnpm/store pnpm install --frozen-lockfile
+
+
+FROM base AS build-express
+WORKDIR /home/node/repo
+COPY --from=deps-express /home/node/repo ./
+
+RUN --mount=type=cache,id=pnpm,target=/pnpm/store pnpm install --frozen-lockfile
+
+COPY . /home/node/repo
+
+RUN pnpm --filter !esi-next run build
+RUN pnpm deploy --filter esi-express --prod /home/node/esi-express
+
+FROM base AS esi-express
+COPY --from=build-express /home/node/esi-express /home/node/esi-express
+WORKDIR /home/node/esi-express
+USER node
+EXPOSE 3000
+CMD [ "node", "dist/server.js" ]
+
+
+
+# Nextjs
+FROM base AS deps-next
+WORKDIR /home/node/repo
+
+COPY ./package.json ./pnpm-lock.yaml ./pnpm-workspace.yaml ./
+COPY ./examples/next/package.json ./examples/next/
+COPY ./lib/package.json ./lib/
 RUN --mount=type=cache,id=pnpm,target=/pnpm/store pnpm install --frozen-lockfile
-RUN pnpm run -r build
 
-FROM base AS lib
-COPY --from=prod-deps /app/lib/node_modules/ /app/lib/node_modules
-COPY --from=build /app/lib/dist /app/lib/dist
 
-FROM lib AS express
-COPY --from=prod-deps /app/examples/express/node_modules/ /app/examples/express/node_modules
-COPY --from=build /app/examples/express/dist /app/examples/express/dist
-WORKDIR /app/examples/express
+FROM base AS build-next
+WORKDIR /home/node/repo
+COPY --from=deps-next /home/node/repo ./
+COPY . /home/node/repo
+
+ENV NEXT_TELEMETRY_DISABLED 1
+RUN pnpm --filter !esi-express run build
+RUN pnpm deploy --filter esi-next --prod /home/node/esi-next
+
+
+FROM base AS esi-next
+WORKDIR /home/node/esi-next
+
+ENV NODE_ENV production
+ENV NEXT_TELEMETRY_DISABLED 1
+
+# Set the correct permission for prerender cache
+RUN mkdir .next
+RUN chown node:node .next
+COPY --from=build-next --chown=node:node /home/node/esi-next/public ./public
+COPY --from=build-next --chown=node:node /home/node/esi-next/node_modules ./node_modules
+COPY --from=build-next --chown=node:node /home/node/esi-next/.next/standalone ./
+COPY --from=build-next --chown=node:node /home/node/esi-next/dist ./dist
+COPY --from=build-next --chown=node:node /home/node/esi-next/.next/static ./.next/static
+
+USER node
 EXPOSE 3000
-CMD [ "pnpm", "start" ]
-
-FROM lib AS next
-COPY --from=prod-deps /app/packages/app2/node_modules/ /app/packages/app2/node_modules
-COPY --from=build /app/packages/app2/dist /app/packages/app2/dist
-WORKDIR /app/packages/app2
-EXPOSE 30001
-CMD [ "pnpm", "start" ]
+CMD [ "node", "dist/server.js" ]

README.md

@@ -19,7 +19,7 @@ Also, React ESI allows the specification of different Time To Live (TTL) per Rea
 The cache server fetches and stores in the cache all the needed fragments (the HTML corresponding to every React component), builds the final page and sends it to the browser.
 React ESI also allows components to (re-)render client-side without any specific configuration.
 
-![ESI example](https://raw.githubusercontent.com/varnish/Varnish-Book/3bd8894181f5e42f628967d04f40116498d1f7f2/ui/img/esi.png )
+![ESI example](https://raw.githubusercontent.com/varnish/Varnish-Book/3bd8894181f5e42f628967d04f40116498d1f7f2/ui/img/esi.png)
 
 > Schema from [The Varnish Book](https://info.varnish-software.com/resources/varnish-6-by-example-book)
 
@@ -101,7 +101,7 @@ export default class MyFragment extends React.Component {
         () =>
           resolve({
             ...props, // Props coming from index.js, passed through the internal URL
-            dataFromAnAPI: "Hello there"
+            dataFromAnAPI: "Hello there",
           }),
         2000
       );
@@ -121,7 +121,6 @@ To serve the fragments, React ESI provides a ready-to-use controller compatible
 
 Alternatively, here is a full example using [a Next.js server](https://github.com/dunglas/react-esi/tree/main/examples/next):
 
-
 ## Features
 
 - Support Varnish, Cloudflare Workers, Akamai, Fastly, and any other cache systems having ESI support

package.json

@@ -5,9 +5,29 @@
   "repository": "https://github.com/dunglas/react-esi",
   "license": "MIT",
   "author": "Kévin Dunglas",
-  "scripts": {},
-  "packageManager": "[email protected]",
+  "scripts": {
+    "lint": "eslint .",
+    "lint:fix": "eslint . --fix",
+    "format": "prettier --write ."
+  },
+  "packageManager": "[email protected]",
   "engines": {
-    "node": ">=18.12.0"
+    "node": ">=20.11.0"
+  },
+  "pnpm": {
+    "overrides": {
+      "@types/react": "18.2.64",
+      "@types/react-dom": "18.2.21",
+      "typescript": "5.3.3"
+    }
+  },
+  "devDependencies": {
+    "@types/node": "^20.11.25",
+    "eslint": "^8.57.0",
+    "eslint-config-prettier": "^9.1.0",
+    "eslint-plugin-react": "^7.34.0",
+    "prettier": "^3.2.5",
+    "typescript": "~5.3.3",
+    "typescript-eslint": "^7.1.1"
   }
-}
+}