build: migrate to yarn v4 (#46)

.changeset/README.md

@@ -0,0 +1,8 @@
+# Changesets
+
+Hello and welcome! This folder has been automatically generated by `@changesets/cli`, a build tool that works
+with multi-package repos, or single-package repos to help you version and publish your code. You can
+find the full documentation for it [in our repository](https://github.com/changesets/changesets)
+
+We have a quick list of common questions to get you started engaging with this project in
+[our documentation](https://github.com/changesets/changesets/blob/main/docs/common-questions.md)

.changeset/config.json

@@ -0,0 +1,11 @@
+{
+  "$schema": "https://unpkg.com/@changesets/config/schema.json",
+  "changelog": "@changesets/changelog-github",
+  "commit": false,
+  "fixed": [],
+  "linked": [],
+  "access": "public",
+  "baseBranch": "master",
+  "updateInternalDependencies": "patch",
+  "ignore": []
+}

.changeset/lemon-pumpkins-smell.md

@@ -0,0 +1,5 @@
+---
+"react-server-renderer": major
+---
+
+feat!: migrate to dual package, ESM is preferred

.changeset/thirty-frogs-beg.md

@@ -0,0 +1,5 @@
+---
+"react-server-renderer": major
+---
+
+feat!: drop node < 12.20.0

.codesandbox/ci.json

@@ -0,0 +1,4 @@
+{
+  "node": "18",
+  "sandboxes": []
+}

.commitlintrc

@@ -0,0 +1,3 @@
+{
+  "extends": "@1stg"
+}

.eslintrc

@@ -1,15 +1,9 @@
 {
-  "extends": "1stg/react",
-  "rules": {
-    "@typescript-eslint/camelcase": 0,
-    "@typescript-eslint/no-explicit-any": 0,
-    "@typescript-eslint/no-use-before-define": [
-      2,
-      {
-        "functions": false,
-        "classes": true
-      }
-    ],
-    "promise/param-names": 0
+  "root": true,
+  "extends": "@1stg",
+  "settings": {
+    "react": {
+      "version": "detect"
+    }
   }
 }

.github/workflows/ci.yml

@@ -0,0 +1,39 @@
+name: CI
+
+on:
+  - push
+  - pull_request
+
+jobs:
+  default:
+    strategy:
+      matrix:
+        node:
+          - 18
+          - 20
+        os:
+          - macOS-latest
+          - ubuntu-latest
+    runs-on: ${{ matrix.os }}
+    steps:
+      - uses: actions/checkout@v4
+
+      - name: Enable Corepack
+        run: corepack enable
+
+      - uses: actions/setup-node@v4
+        with:
+          node-version: ${{ matrix.node }}
+          cache: yarn
+
+      - name: Install Dependencies
+        run: yarn --immutable
+
+      - name: Lint, Build
+        run: |
+          yarn lint
+          yarn typecov
+          yarn build
+        env:
+          EFF_NO_LINK_RULES: true
+          PARSER_NO_WATCH: true

.github/workflows/codeql.yml

@@ -0,0 +1,44 @@
+name: CodeQL
+
+on:
+  push:
+    branches:
+      - master
+  pull_request:
+    branches:
+      - master
+  schedule:
+    - cron: 39 11 * * 1
+
+jobs:
+  analyze:
+    name: Analyze
+    runs-on: ubuntu-latest
+    permissions:
+      actions: read
+      contents: read
+      security-events: write
+
+    strategy:
+      fail-fast: false
+      matrix:
+        language:
+          - javascript
+
+    steps:
+      - name: Checkout
+        uses: actions/checkout@v4
+
+      - name: Initialize CodeQL
+        uses: github/codeql-action/init@v2
+        with:
+          languages: ${{ matrix.language }}
+          queries: +security-and-quality
+
+      - name: Autobuild
+        uses: github/codeql-action/autobuild@v2
+
+      - name: Perform CodeQL Analysis
+        uses: github/codeql-action/analyze@v2
+        with:
+          category: '/language:${{ matrix.language }}'

.github/workflows/release.yml

@@ -0,0 +1,41 @@
+name: Release
+
+on:
+  push:
+    branches:
+      - master
+
+jobs:
+  release:
+    name: Release
+    runs-on: ubuntu-latest
+    steps:
+      - name: Checkout Repo
+        uses: actions/checkout@v4
+        with:
+          # This makes Actions fetch all Git history so that Changesets can generate changelogs with the correct commits
+          fetch-depth: 0
+
+      - name: Enable Corepack
+        run: corepack enable
+
+      - name: Setup Node.js LTS
+        uses: actions/setup-node@v4
+        with:
+          node-version: lts/*
+          cache: yarn
+
+      - name: Install Dependencies
+        run: yarn --immutable
+
+      - name: Create Release Pull Request or Publish to npm
+        id: changesets
+        uses: changesets/action@v1
+        with:
+          commit: 'chore: release synckit'
+          title: 'chore: release synckit'
+          version: yarn run version
+          publish: yarn release
+        env:
+          GITHUB_TOKEN: ${{ secrets.GH_TOKEN }}
+          NPM_TOKEN: ${{ secrets.NPM_TOKEN }}

.gitignore

@@ -1,3 +1,5 @@
 lib
 node_modules
 *.log
+.*cache
+.type-coverage

.lintstagedrc.cjs

@@ -0,0 +1 @@
+module.exports = require('@1stg/lint-staged/tsc')

.prettierrc

@@ -1,5 +1 @@
-{
-  "semi": false,
-  "singleQuote": true,
-  "trailingComma": "all"
-}
+"@1stg/prettier-config"

.simple-git-hooks.cjs

@@ -0,0 +1 @@
+module.exports = require('@1stg/simple-git-hooks')

.yarn/plugins/plugin-prepare-lifecycle.cjs

@@ -0,0 +1 @@
+module.exports={name:"plugin-prepare-lifecycle",factory:e=>({hooks:{afterAllInstalled(r){if(!r.topLevelWorkspace.manifest.scripts.get("prepare"))return;e("@yarnpkg/shell").execute("yarn prepare")}}})};

.yarnrc.yml

@@ -0,0 +1,6 @@
+nodeLinker: node-modules
+
+plugins:
+  - checksum: 37b2361b1502b2054e6779788c0e9bdd6a90ce49852a8cad2feda79b0614ec94f06fb6e78951f5f95429c610d7934dd077caa47413a0227378a102c55161616d
+    path: .yarn/plugins/plugin-prepare-lifecycle.cjs
+    spec: 'https://github.com/un-es/yarn-plugin-prepare-lifecycle/releases/download/v0.0.1/index.js'

README.md

@@ -1,10 +1,14 @@
 # react-server-renderer
 
-[![Greenkeeper badge](https://badges.greenkeeper.io/JounQin/react-server-renderer.svg)](https://greenkeeper.io/)
-[![Travis](https://img.shields.io/travis/JounQin/react-server-renderer.svg)](https://travis-ci.org/JounQin/react-server-renderer)
-[![David](https://img.shields.io/david/JounQin/react-server-renderer.svg)](https://david-dm.org/JounQin/react-server-renderer)
-[![David Dev](https://img.shields.io/david/dev/JounQin/react-server-renderer.svg)](https://david-dm.org/JounQin/react-server-renderer?type=dev)
-[![code style: prettier](https://img.shields.io/badge/code_style-prettier-ff69b4.svg)](https://github.com/prettier/prettier)
+[![GitHub Actions](https://github.com/un-ts/react-server-renderer/workflows/CI/badge.svg)](https://github.com/un-ts/react-server-renderer/actions/workflows/ci.yml)
+[![npm](https://img.shields.io/npm/v/react-server-renderer.svg)](https://www.npmjs.com/package/react-server-renderer)
+[![GitHub Release](https://img.shields.io/github/release/un-ts/react-server-renderer)](https://github.com/un-ts/react-server-renderer/releases)
+
+[![Conventional Commits](https://img.shields.io/badge/conventional%20commits-1.0.0-yellow.svg)](https://conventionalcommits.org)
+[![Renovate enabled](https://img.shields.io/badge/renovate-enabled-brightgreen.svg)](https://renovatebot.com)
+[![JavaScript Style Guide](https://img.shields.io/badge/code_style-standard-brightgreen.svg)](https://standardjs.com)
+[![Code Style: Prettier](https://img.shields.io/badge/code_style-prettier-ff69b4.svg)](https://github.com/prettier/prettier)
+[![changesets](https://img.shields.io/badge/maintained%20with-changesets-176de3.svg)](https://github.com/atlassian/changesets)
 
 Yet another simple React SSR solution inspired by vue-server-render with:
 
@@ -22,7 +26,7 @@ Yet another simple React SSR solution inspired by vue-server-render with:
 
 This module is heavily inspired by [vue-server-render](https://ssr.vuejs.org), it is recommended to read about [bundle-renderer](https://ssr.vuejs.org/en/bundle-renderer.html).
 
-It uses [react-router](https://github.com/ReactTraining/react-router) on server, so you should read about [Server Rendering](https://reacttraining.com/react-router/web/guides/server-rendering).
+It uses [react-router](https://github.com/remix-run/react-router) on server, so you should read about [Server Rendering](https://reactrouter.com/en/main/guides/ssr).
 
 And also, data injection should be implement with [asyncBootstrap](https://github.com/ctrlplusb/react-async-bootstrapper).
 
@@ -120,11 +124,14 @@ export default merge.smart(base, {
 You can then use the generated client manifest, together with a page template:
 
 ```js
-const { createBundleRenderer } = require('react-server-renderer')
+import fs from 'node:fs'
+
+import { createBundleRenderer } from 'react-server-renderer'
 
-const template = require('fs').readFileSync('/path/to/template.html', 'utf-8')
-const serverBundle = require('/path/to/react-ssr-server-bundle.json')
-const clientManifest = require('/path/to/react-ssr-client-manifest.json')
+import serverBundle from '/path/to/react-ssr-server-bundle.json' with { type: 'json' }
+import  clientManifest from '/path/to/react-ssr-client-manifest.json' with { type: 'json' }
+
+import template = fs.readFileSync('/path/to/template.html', 'utf-8')
 
 const renderer = createBundleRenderer(serverBundle, {
   template,
@@ -138,11 +145,27 @@ With this setup, your server-rendered HTML for a build with code-splitting will
 <html>
   <head>
     <!-- chunks used for this render will be preloaded -->
-    <link rel="preload" href="/manifest.js" as="script">
-    <link rel="preload" href="/main.js" as="script">
-    <link rel="preload" href="/0.js" as="script">
+    <link
+      rel="preload"
+      href="/manifest.js"
+      as="script"
+    />
+    <link
+      rel="preload"
+      href="/main.js"
+      as="script"
+    />
+    <link
+      rel="preload"
+      href="/0.js"
+      as="script"
+    />
     <!-- unused async chunks will be prefetched (lower priority) -->
-    <link rel="prefetch" href="/1.js" as="script">
+    <link
+      rel="prefetch"
+      href="/1.js"
+      as="script"
+    />
   </head>
   <body>
     <!-- app content -->
@@ -153,7 +176,8 @@ With this setup, your server-rendered HTML for a build with code-splitting will
     <script src="/0.js"></script>
     <script src="/main.js"></script>
   </body>
-</html>`
+</html>
+`
 ```
 
 ### Server bundle
@@ -228,10 +252,10 @@ export const withSsr = (styles, router = true, title) => {
   }
 
   return Component => {
-    class SsrConmponent extends React.PureComponent {
-      static displayName = `Ssr${Component.displayName ||
-        Component.name ||
-        'Component'}`
+    class SsrComponent extends React.PureComponent {
+      static displayName = `Ssr${
+        Component.displayName || Component.name || 'Component'
+      }`
 
       static propTypes = {
         staticContext: PropTypes.object,
@@ -258,7 +282,7 @@ export const withSsr = (styles, router = true, title) => {
     }
 
     return hoistStatics(
-      router ? withRouter(SsrConmponent) : SsrConmponent,
+      router ? withRouter(SsrComponent) : SsrComponent,
       Component,
     )
   }
@@ -311,11 +335,17 @@ export default class Home extends React.PureComponent {
     return (
       <div className="container">
         <h2 className={styles.heading}>Counter</h2>
-        <button className="btn btn-primary" onClick={this.props.decrease}>
+        <button
+          className="btn btn-primary"
+          onClick={this.props.decrease}
+        >
           -
         </button>
         {this.props.counter}
-        <button className="btn btn-primary" onClick={this.props.increase}>
+        <button
+          className="btn btn-primary"
+          onClick={this.props.increase}
+        >
           +
         </button>
       </div>