From 9df75909831c791cd5800a1b0a7840272e6762ab Mon Sep 17 00:00:00 2001 From: Daniel Roe Date: Wed, 3 Apr 2024 14:01:27 +0100 Subject: [PATCH 1/2] docs: use new `nuxi module add` command in installation --- README.md | 9 +-------- .../content/1.getting-started/1.installation.md | 17 ++--------------- 2 files changed, 3 insertions(+), 23 deletions(-) diff --git a/README.md b/README.md index ca673f3b..933c1c66 100755 --- a/README.md +++ b/README.md @@ -31,14 +31,7 @@ 1. Add `@nuxtjs/tailwindcss` dependency to your project ```bash -# Using pnpm -pnpm add --save-dev @nuxtjs/tailwindcss - -# Using yarn -yarn add --dev @nuxtjs/tailwindcss - -# Using npm -npm install --save-dev @nuxtjs/tailwindcss +npx nuxi@latest module add tailwindcss ``` *You can test latest additions on [Nightly Releases](https://tailwindcss.nuxtjs.org/getting-started/installation#nightly-releases)!* diff --git a/docs/content/1.getting-started/1.installation.md b/docs/content/1.getting-started/1.installation.md index 70fa20cd..b26ba4bc 100644 --- a/docs/content/1.getting-started/1.installation.md +++ b/docs/content/1.getting-started/1.installation.md @@ -6,23 +6,10 @@ description: Using Tailwind CSS in your Nuxt project is only one command away. ## Installation 1. Install `@nuxtjs/tailwindcss` dependency to your project: - -::code-group - -```bash [yarn] -yarn add -D @nuxtjs/tailwindcss -``` - -```bash [npm] -npm install -D @nuxtjs/tailwindcss -``` - -```sh [pnpm] -pnpm i -D @nuxtjs/tailwindcss +```bash +npx nuxi@latest module add tailwindcss ``` -:: - 2. Add it to your `modules` section in your `nuxt.config`: ::code-group From 7527b17f0da1c34b11617445538a53f2cc8d58af Mon Sep 17 00:00:00 2001 From: Inesh Bose Date: Fri, 5 Apr 2024 19:29:30 +0100 Subject: [PATCH 2/2] chore: fix up wording --- README.md | 19 ++++++++++++++--- .../1.getting-started/1.installation.md | 21 +++++++++++++++++-- 2 files changed, 35 insertions(+), 5 deletions(-) diff --git a/README.md b/README.md index 933c1c66..538a4d48 100755 --- a/README.md +++ b/README.md @@ -28,15 +28,26 @@ ## Quick Setup -1. Add `@nuxtjs/tailwindcss` dependency to your project +Add `@nuxtjs/tailwindcss` using the [Nuxt CLI](https://github.com/nuxt/cli) to your project ```bash npx nuxi@latest module add tailwindcss ``` -*You can test latest additions on [Nightly Releases](https://tailwindcss.nuxtjs.org/getting-started/installation#nightly-releases)!* +or add `@nuxtjs/tailwindcss` using your dependency manager + +```bash +# Using pnpm +pnpm add --save-dev @nuxtjs/tailwindcss + +# Using yarn +yarn add --dev @nuxtjs/tailwindcss -2. Add `@nuxtjs/tailwindcss` to the `modules` section of `nuxt.config.{ts,js}` +# Using npm +npm install --save-dev @nuxtjs/tailwindcss +``` + +and then to the `modules` section of `nuxt.config.{ts,js}` ```ts export default defineNuxtConfig({ @@ -48,6 +59,8 @@ export default defineNuxtConfig({ That's it! You can now use Tailwind classes in your Nuxt app ✨ +*You can test latest additions on [Nightly Releases](https://tailwindcss.nuxtjs.org/getting-started/installation#nightly-releases)!* + [📖  Read more](https://tailwindcss.nuxtjs.org/getting-started/) ## Contributing diff --git a/docs/content/1.getting-started/1.installation.md b/docs/content/1.getting-started/1.installation.md index b26ba4bc..a9843e40 100644 --- a/docs/content/1.getting-started/1.installation.md +++ b/docs/content/1.getting-started/1.installation.md @@ -6,11 +6,28 @@ description: Using Tailwind CSS in your Nuxt project is only one command away. ## Installation 1. Install `@nuxtjs/tailwindcss` dependency to your project: -```bash + +::code-group + +```bash [nuxi] npx nuxi@latest module add tailwindcss ``` -2. Add it to your `modules` section in your `nuxt.config`: +```bash [yarn] +yarn add -D @nuxtjs/tailwindcss +``` + +```bash [npm] +npm install -D @nuxtjs/tailwindcss +``` + +```sh [pnpm] +pnpm i -D @nuxtjs/tailwindcss +``` + +:: + +2. If not already done, add it to your `modules` section in your `nuxt.config`: ::code-group ```ts [Nuxt 3]