From 56e30d7739fc1dbc62fd71892f218dcb2edee69b Mon Sep 17 00:00:00 2001
From: Juri Strumpflohner <juri.strumpflohner@gmail.com>
Date: Thu, 15 Jul 2021 21:27:58 +0200
Subject: [PATCH] docs(react): adjust Tailwind guide for React (#6386)

---
 .../react/guides/using-tailwind-css-in-react.md   | 15 +++++++++++++--
 1 file changed, 13 insertions(+), 2 deletions(-)

diff --git a/nx-dev/nx-dev/public/documentation/latest/react/guides/using-tailwind-css-in-react.md b/nx-dev/nx-dev/public/documentation/latest/react/guides/using-tailwind-css-in-react.md
index 117e1a2737..6a9b2b0adb 100644
--- a/nx-dev/nx-dev/public/documentation/latest/react/guides/using-tailwind-css-in-react.md
+++ b/nx-dev/nx-dev/public/documentation/latest/react/guides/using-tailwind-css-in-react.md
@@ -28,9 +28,13 @@ This creates the needed files with a general boilerplate implementation.
 Next, adjust the `postcss.config.js` as follows:
 
 ```js
+const { join } = require('path');
+
 module.exports = {
   plugins: {
-    tailwindcss: { config: './apps/{your app here}/tailwind.config.js' },
+    tailwindcss: {
+      config: join(__dirname, 'tailwind.config.js'),
+    },
     autoprefixer: {},
   },
 };
@@ -43,10 +47,15 @@ In a typical `tailwind.config.js` file, the `purge` property of the tailwind con
 Nx has a utility function for determining the glob representation of all files the application depends on (based on the Nx Dependency Graph), which should be used when setting this purge property. This eliminates additional manual maintenance as your workspace progresses.
 
 ```js
+const { join } = require('path');
 const { createGlobPatternsForDependencies } = require('@nrwl/react/tailwind');
 
 module.exports = {
-  purge: createGlobPatternsForDependencies(__dirname),
+  purge: [
+    // place your own app's glob pattern (for example)
+    join(__dirname, '**/*.{js,ts,jsx,tsx}'),
+    ...createGlobPatternsForDependencies(__dirname),
+  ],
   darkMode: false, // or 'media' or 'class'
   theme: {
     extend: {},
@@ -58,6 +67,8 @@ module.exports = {
 };
 ```
 
+`createGlobPatternsForDependencies(..)` uses the Nx dependency graph to generate glob patterns for all the app's **dependencies** (e.g. for all referenced libraries within the Nx workspace).
+
 _NOTE:_ To ensure proper purging for custom configurations, be sure that the `NODE_ENV` environment variable is set to `production`. By default, Nx only purges on prod build (for example: `nx build --prod`).
 
 ## Step 3: Import TailwindCss Styles