vercel · jaredpalmer · Dec 14, 2021 · Dec 14, 2021 · Dec 14, 2021 · Dec 14, 2021
@@ -0,0 +1,13 @@
+.DS_Store
+node_modules
+.turbo
+*.log
+.next
+dist
+dist-ssr
+*.local
+.env
+.cache
+server/dist
+public/dist
+.turbo
@@ -0,0 +1,9 @@
+node_modules
+.next
+build
+dist
+*.tsbuildinfo
+*.gitignore
+*.svg
+*.lock
+*.npmignore
@@ -0,0 +1,4 @@
+{
+  "singleQuote": false,
+  "semi": true
+}
@@ -0,0 +1,63 @@
+# Turborepo Design System starter
+
+This is an official React design system starter powered by Turborepo.
+
+## What's inside?
+
+This Turborepo includes the following packages and apps:
+
+### Apps and Packages
+
+- `docs`: A placeholder documentation site powered by [Next.js](https://nextjs.org)
+- `@acme/core`: core React components
+- `@acme/utils`: shared React utilities
+- `@acme/tsconfig`: shared `tsconfig.json`s used throughout the monorepo
+- `eslint-preset-acme`: ESLint preset
+
+Each package and app is 100% [Typescript](https://www.typescriptlang.org/).
+
+### Utilities
+
+This turborepo has some additional tools already setup for you:
+
+- [Typescript](https://www.typescriptlang.org/) for static type checking
+- [ESLint](https://eslint.org/) for code linting
+- [Jest](https://jestjs.io) test runner for all things JavaScript
+- [Prettier](https://prettier.io) for code formatting
+
+## Using this example
+
+We do not have a starter yet in `create-turbo` for this quite yet. If you want to use this in the interim, you run the following command:
+
+```sh
+npx degit vercel/turborepo/examples/design-system design-system
+cd design-system
+git init . && git add . && git commit -m "Init"
+yarn install
+```
+
+### Changing the NPM organization scope
+
+The NPM organization scope for this design system starter is `@acme`. To change this, it's a bit manual at the moment, but you'll need to do the following:
+
+- Rename folders in `packages/*` to replace `acme` with your desired scope
+- Search and replace `acme` with your desired scope
+- Re-run `yarn install`
+
+### Publishing packages
+
+#### NPM
+
+If you want to publish package to the public NPM registry and make them publicly available, this is already setup for you.
+
+To publish packages to a private NPM organization scope, **remove** the following from each of the `package.json`'s
+
+```diff
+- "publishConfig": {
+-  "access": "public"
+- },
+```
+
+#### GitHub Package Registry
+
+See [Working with the npm registry](https://docs.github.com/en/packages/working-with-a-github-packages-registry/working-with-the-npm-registry#publishing-a-package-using-publishconfig-in-the-packagejson-file)
@@ -0,0 +1 @@
+module.exports = require("eslint-preset-acme");
@@ -0,0 +1,5 @@
+/// <reference types="next" />
+/// <reference types="next/image-types/global" />
+
+// NOTE: This file should not be edited
+// see https://nextjs.org/docs/basic-features/typescript for more information.
@@ -0,0 +1,3 @@
+module.exports = {
+  reactStrictMode: true,
+};
@@ -0,0 +1,26 @@
+{
+  "name": "@acme/docs",
+  "version": "0.0.0",
+  "private": true,
+  "scripts": {
+    "build": "next build",
+    "start": "next start ",
+    "dev": "next dev -p 3002",
+    "lint": "TIMING=1 next lint",
+    "clean": "rm -rf .turbo && rm -rf node_modules && rm -rf .next"
+  },
+  "dependencies": {
+    "@acme/core": "*",
+    "@acme/utils": "*",
+    "next": "^12.0.7",
+    "react": "^17.0.2",
+    "react-dom": "^17.0.2"
+  },
+  "devDependencies": {
+    "@acme/tsconfig": "*",
+    "@types/react": "^17.0.37",
+    "@types/react-dom": "^17.0.11",
+    "eslint-preset-acme": "*",
+    "typescript": "^4.5.4"
+  }
+}
@@ -0,0 +1,14 @@
+import { Button } from "@acme/core";
+import { useIsomorphicLayoutEffect } from "@acme/utils";
+
+export default function Docs() {
+  useIsomorphicLayoutEffect(() => {
+    console.log("Acme docs page");
+  }, []);
+  return (
+    <div>
+      <h1>Acme Documentation</h1>
+      <Button />
+    </div>
+  );
+}
@@ -0,0 +1,10 @@
+{
+  "exclude": ["node_modules"],
+  "extends": "@acme/tsconfig/nextjs.json",
+  "compilerOptions": {
+    "rootDir": "src",
+    "outDir": "dist",
+    "incremental": true
+  },
+  "include": ["src", "next-env.d.ts"]
+}
@@ -0,0 +1,46 @@
+{
+  "name": "turborepo-design-system",
+  "version": "0.0.0",
+  "private": true,
+  "workspaces": [
+    "packages/*",
+    "apps/*"
+  ],
+  "scripts": {
+    "build": "turbo run build",
+    "dev": "turbo run dev --no-cache --parallel --continue",
+    "lint": "turbo run lint",
+    "test": "turbo run test",
+    "clean": "turbo run clean && rm -rf node_modules"
+  },
+  "devDependencies": {
+    "eslint": "^8.4.1",
+    "prettier": "^2.5.1",
+    "turbo": "latest"
+  },
+  "turbo": {
+    "pipeline": {
+      "build": {
+        "outputs": [
+          "dist/**",
+          ".next/**"
+        ],
+        "dependsOn": [
+          "^build"
+        ]
+      },
+      "test": {
+        "outputs": [
+          "coverage/**"
+        ],
+        "dependsOn": []
+      },
+      "lint": {
+        "outputs": []
+      },
+      "dev": {
+        "cache": false
+      }
+    }
+  }
+}
@@ -0,0 +1 @@
+module.exports = require("eslint-preset-acme");
@@ -0,0 +1,30 @@
+{
+  "name": "@acme/core",
+  "version": "0.0.0",
+  "main": "./dist/index.js",
+  "module": "./dist/index.mjs",
+  "types": "./dist/index.d.ts",
+  "sideEffects": false,
+  "license": "MIT",
+  "files": [
+    "dist/**"
+  ],
+  "scripts": {
+    "build": "tsup src/index.tsx --format esm,cjs --dts --external react",
+    "dev": "tsup src/index.tsx --format esm,cjs --watch --dts --external react",
+    "lint": "TIMING=1 eslint src --fix",
+    "clean": "rm -rf .turbo && rm -rf node_modules && rm -rf dist"
+  },
+  "devDependencies": {
+    "@acme/tsconfig": "*",
+    "eslint-preset-acme": "*",
+    "@types/react": "^17.0.13",
+    "@types/react-dom": "^17.0.8",
+    "react": "^17.0.2",
+    "tsup": "^5.10.1",
+    "typescript": "^4.2.4"
+  },
+  "publishConfig": {
+    "access": "public"
+  }
+}
@@ -0,0 +1,11 @@
+import * as React from "react";
+
+export interface ButtonProps {
+  children: React.ReactNode;
+}
+
+export function Button(props: ButtonProps) {
+  return <button>{props.children}</button>;
+}
+
+Button.displayName = "Button";
@@ -0,0 +1,23 @@
+import * as React from "react";
+
+export const Button = () => {
+  const [count, setCount] = React.useState(0);
+  return (
+    <div
+      style={{
+        background: `rgba(255,255,255,.05)`,
+        borderRadius: `8px`,
+        padding: 16,
+      }}
+    >
+      <p>
+        This is component iadasdfsdfdffsfsds from <code>ui</code>
+      </p>
+      <p>
+        <button type="button" onClick={() => setCount((c) => c + 1)}>
+          count {count}
+        </button>
+      </p>
+    </div>
+  );
+};
@@ -0,0 +1,13 @@
+{
+  "compilerOptions": {
+    "jsx": "react-jsx",
+    "lib": ["ES2015", "DOM"],
+    "target": "ES6",
+    "module": "ESNext",
+    "outDir": "./dist",
+    "rootDir": "./src"
+  },
+  "exclude": ["node_modules", "src/__test__/**/*"],
+  "extends": "@acme/tsconfig/react-library.json",
+  "include": ["src"]
+}
@@ -0,0 +1,3 @@
+# `tsconfig`
+
+This is the Turborepo shared `tsconfig.json` from which all sother `tsconfig.json`'s inherit from. Making changes to this may have unintended consequences.
@@ -0,0 +1,19 @@
+{
+  "$schema": "https://json.schemastore.org/tsconfig",
+  "display": "Default",
+  "compilerOptions": {
+    "composite": false,
+    "declaration": true,
+    "declarationMap": true,
+    "esModuleInterop": true,
+    "forceConsistentCasingInFileNames": true,
+    "inlineSources": false,
+    "isolatedModules": true,
+    "noUnusedLocals": false,
+    "noUnusedParameters": false,
+    "preserveWatchOutput": true,
+    "skipLibCheck": true,
+    "strict": true
+  },
+  "exclude": ["node_modules"]
+}
@@ -0,0 +1,21 @@
+{
+  "$schema": "https://json.schemastore.org/tsconfig",
+  "display": "Next.js",
+  "extends": "./base.json",
+  "compilerOptions": {
+    "target": "es5",
+    "lib": ["dom", "dom.iterable", "esnext"],
+    "allowJs": true,
+    "skipLibCheck": true,
+    "noEmit": true,
+    "module": "esnext",
+    "moduleResolution": "node",
+    "resolveJsonModule": true,
+    "isolatedModules": true,
+    "incremental": true,
+    "jsx": "preserve",
+    "rootDir": "src"
+  },
+  "include": ["src", "next-env.d.ts"],
+  "exclude": ["node_modules"]
+}
@@ -0,0 +1,14 @@
+{
+  "$schema": "https://json.schemastore.org/tsconfig",
+  "display": "Node 14",
+  "extends": "./base.json",
+  "compilerOptions": {
+    "lib": ["es2020"],
+    "module": "commonjs",
+    "target": "es2020",
+    "strict": true,
+    "esModuleInterop": true,
+    "skipLibCheck": true,
+    "forceConsistentCasingInFileNames": true
+  }
+}
@@ -0,0 +1,15 @@
+{
+  "name": "@acme/tsconfig",
+  "version": "0.0.0",
+  "license": "MIT",
+  "main": "index.js",
+  "files": [
+    "base.json",
+    "node14.json",
+    "nextjs.json",
+    "react-library.json"
+  ],
+  "publishConfig": {
+    "access": "public"
+  }
+}
@@ -0,0 +1,14 @@
+{
+  "$schema": "https://json.schemastore.org/tsconfig",
+  "display": "React Library",
+  "extends": "./base.json",
+  "include": ["src"],
+  "exclude": ["node_modules"],
+  "compilerOptions": {
+    "lib": ["ES2015"],
+    "module": "ESNext",
+    "rootDir": "src",
+    "outDir": "dist",
+    "jsx": "react"
+  }
+}
@@ -0,0 +1 @@
+module.exports = require("eslint-preset-acme");
Original file line number	Diff line number	Diff line change
		@@ -0,0 +1 @@
		module.exports = require("eslint-preset-acme");
Original file line number	Diff line number	Diff line change
		@@ -0,0 +1,3 @@
		# `tsconfig`

		This is the Turborepo shared `tsconfig.json` from which all sother `tsconfig.json`'s inherit from. Making changes to this may have unintended consequences.