P4Pillon/websites
4
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity
1 Commit 3 Branches 0 Tags 13 MiB
HTML 55.5%
JavaScript 32%
Python 11.7%
CSS 0.8%
9eee5ad8a0
Go to file
Turbobot 9eee5ad8a0 feat(create-turbo): create with-tailwind
2023-11-13 11:24:58 +01:00
apps feat(create-turbo): create with-tailwind 2023-11-13 11:24:58 +01:00
packages feat(create-turbo): create with-tailwind 2023-11-13 11:24:58 +01:00
.gitignore feat(create-turbo): create with-tailwind 2023-11-13 11:24:58 +01:00
.npmrc feat(create-turbo): create with-tailwind 2023-11-13 11:24:58 +01:00
meta.json feat(create-turbo): create with-tailwind 2023-11-13 11:24:58 +01:00
package.json feat(create-turbo): create with-tailwind 2023-11-13 11:24:58 +01:00
pnpm-lock.yaml feat(create-turbo): create with-tailwind 2023-11-13 11:24:58 +01:00
pnpm-workspace.yaml feat(create-turbo): create with-tailwind 2023-11-13 11:24:58 +01:00
README.md feat(create-turbo): create with-tailwind 2023-11-13 11:24:58 +01:00
tsconfig.json feat(create-turbo): create with-tailwind 2023-11-13 11:24:58 +01:00
turbo.json feat(create-turbo): create with-tailwind 2023-11-13 11:24:58 +01:00

README.md

Turborepo Tailwind CSS starter

This is an official starter Turborepo.

Using this example

Run the following command:

npx create-turbo@latest -e with-tailwind

What's inside?

This Turborepo includes the following packages/apps:

Apps and Packages

  • docs: a Next.js app with Tailwind CSS
  • web: another Next.js app with Tailwind CSS
  • ui: a stub React component library with Tailwind CSS shared by both web and docs applications
  • eslint-config-custom: eslint configurations (includes eslint-config-next and eslint-config-prettier)
  • tsconfig: tsconfig.jsons used throughout the monorepo

Each package/app is 100% TypeScript.

Building packages/ui

This example is setup to build packages/ui and output the transpiled source and compiled styles to dist/. This was chosen to make sharing one tailwind.config.js as easy as possible, and to ensure only the CSS that is used by the current application and its dependencies is generated.

Another option is to consume packages/ui directly from source without building. If using this option, you will need to update your tailwind.config.js to be aware of your package locations, so it can find all usages of the tailwindcss class names.

For example, in tailwind.config.js:

  content: [
    // app content
    `src/**/*.{js,ts,jsx,tsx}`,
    // include packages if not transpiling
    "../../packages/**/*.{js,ts,jsx,tsx}",
  ],

Utilities

This Turborepo has some additional tools already setup for you: