feat: release tailwindcss-patch 1.0.1

compat menorepo issue

Author: sonofmagic

apps/vite-vue/package.json

@@ -5,7 +5,7 @@
   "type": "module",
   "scripts": {
     "dev": "vite",
-    "build": "vue-tsc && vite build",
+    "build": "vite build",
     "preview": "vite preview",
     "prepare": "tw-patch"
   },

apps/webpack5-vue3/vue.config.js

@@ -1,4 +1,8 @@
 const { defineConfig } = require('@vue/cli-service')
+const utwm = require('unplugin-tailwindcss-mangle')
 module.exports = defineConfig({
-  transpileDependencies: true
+  transpileDependencies: true,
+  configureWebpack: (config) => {
+    config.plugins.push(utwm.webpack())
+  }
 })

packages/tailwindcss-patch/package.json

@@ -1,6 +1,6 @@
 {
   "name": "tailwindcss-patch",
-  "version": "1.0.0",
+  "version": "1.0.1",
   "description": "patch tailwindcss for exposing context",
   "main": "dist/index.js",
   "types": "dist/types/index.d.ts",
@@ -36,6 +36,7 @@
   "devDependencies": {
     "@types/babel__generator": "^7.6.4",
     "@types/babel__traverse": "^7.18.3",
+    "@types/resolve": "^1.20.2",
     "@types/semver": "^7.3.13",
     "defu": "^6.1.2",
     "pkg-types": "^1.0.2",
@@ -47,6 +48,7 @@
     "@babel/parser": "^7.21.4",
     "@babel/traverse": "^7.21.4",
     "@babel/types": "^7.21.4",
+    "resolve": "^1.22.2",
     "semver": "^7.4.0"
   },
   "homepage": "https://github.com/sonofmagic/tailwindcss-mangle",

packages/tailwindcss-patch/src/exposeContext.ts

@@ -1,12 +1,19 @@
 import path from 'path'
 import fs from 'fs'
 import type { Rule } from 'postcss'
+import { requireResolve } from './utils'
+
+export function getTailwindcssEntry(basedir: string = process.cwd()) {
+  return requireResolve('tailwindcss', {
+    basedir
+  })
+}
+
+export function getContexts(basedir?: string) {
+  const twPath = getTailwindcssEntry(basedir)
+
+  const distPath = path.dirname(twPath)
 
-export function getContexts() {
-  // const cwd = process.cwd()
-  const distPath = path.dirname(require.resolve('tailwindcss/lib')) //  path.join(cwd, 'node_modules', 'tailwindcss/lib')
-  // index.js
-  // plugin.js
   let injectFilePath = path.join(distPath, 'plugin.js')
   if (!fs.existsSync(injectFilePath)) {
     injectFilePath = path.join(distPath, 'index.js')
@@ -23,10 +30,10 @@ export function getClassCaches(): Map<
   string,
   (
     | {
-        layer: string
-        options: Record<string, any>
-        sort: Record<string, any>
-      }
+      layer: string
+      options: Record<string, any>
+      sort: Record<string, any>
+    }
     | Rule
   )[]
 >[] {

packages/tailwindcss-patch/src/patcher.ts

@@ -6,13 +6,14 @@ import type { PatchOptions, InternalPatchOptions } from './type'
 import type { PackageJson } from 'pkg-types'
 import { defu } from 'defu'
 import { defaultOptions } from './defaults'
-import { ensureFileContent } from './utils'
+import { ensureFileContent, requireResolve } from './utils'
 
 export function getInstalledPkgJsonPath(options: PatchOptions) {
   try {
     // const cwd = process.cwd()
-    const tmpJsonPath = require.resolve(`tailwindcss/package.json`, {
-      paths: options.paths
+    const tmpJsonPath = requireResolve(`tailwindcss/package.json`, {
+      paths: options.paths,
+      basedir: options.basedir ?? process.cwd()
     })
 
     const pkgJson = require(tmpJsonPath) as PackageJson
@@ -23,7 +24,7 @@ export function getInstalledPkgJsonPath(options: PatchOptions) {
     }
   } catch (error) {
     if ((<Error & { code: string }>error).code === 'MODULE_NOT_FOUND') {
-      console.warn('没有找到`tailwindcss`包，请确认是否安装。')
+      console.warn('Can\'t find npm pkg: `tailwindcss`, Please ensure it has been installed!')
     }
   }
 }

packages/tailwindcss-patch/src/type.ts

@@ -1,9 +1,11 @@
 export interface PatchOptions {
   overwrite?: boolean
   paths?: string[]
+  basedir?: string
 }
 
 export interface InternalPatchOptions {
   overwrite: boolean
   paths?: string[]
+  basedir?: string
 }

packages/tailwindcss-patch/src/utils.ts

@@ -1,4 +1,5 @@
 import fs from 'fs'
+import { sync, type SyncOpts } from 'resolve'
 
 export function ensureFileContent(filepaths: string | string[]) {
   if (typeof filepaths === 'string') {
@@ -16,3 +17,7 @@ export function ensureFileContent(filepaths: string | string[]) {
   }
   return content
 }
+
+export function requireResolve(id: string, opts?: SyncOpts) {
+  return sync(id, opts)
+}

packages/unplugin-tailwindcss-mangle/src/index.ts

@@ -8,10 +8,10 @@ import ClassGenerator from './classGenerator'
 import { htmlHandler } from './html'
 import { jsHandler } from './js'
 import { cssHandler } from './css'
-import type {} from 'webpack'
+import type { } from 'webpack'
 const unplugin = createUnplugin((options: Options | undefined = {}, meta) => {
-  // const preserveClass = ['filter']
-  const mangleClass = (className: string) => {
+
+  const isMangleClass = (className: string) => {
     // ignore className like 'filter','container'
     // it may be dangerous to mangle/rename all StringLiteral , so use /-/ test for only those with /-/ like:
     // bg-[#123456] w-1 etc...
@@ -21,21 +21,16 @@ const unplugin = createUnplugin((options: Options | undefined = {}, meta) => {
   // let cached: boolean
   const classGenerator = new ClassGenerator()
   function getCachedClassSet() {
-    // if (cached) {
-    //   return classSet
-    // }
+
     const set = getClassCacheSet()
     set.forEach((c) => {
-      if (!mangleClass(c)) {
+      if (!isMangleClass(c)) {
         set.delete(c)
-        // console.log(c)
       }
     })
-    // preserveClass.forEach((c) => {
-    //   set.delete(c)
-    // })
+
     classSet = set
-    // cached = true
+
     return classSet
   }
   return {
@@ -45,6 +40,9 @@ const unplugin = createUnplugin((options: Options | undefined = {}, meta) => {
       generateBundle: {
         handler(options, bundle, isWrite) {
           const runtimeSet = getCachedClassSet()
+          if (!runtimeSet.size) {
+            return
+          }
           const groupedEntries = getGroupedEntries(Object.entries(bundle))
 
           if (Array.isArray(groupedEntries.html) && groupedEntries.html.length) {
@@ -91,6 +89,9 @@ const unplugin = createUnplugin((options: Options | undefined = {}, meta) => {
             // const resolvePath = require.resolve('tailwindcss')
             // console.log(resolvePath)
             const runtimeSet = getCachedClassSet()
+            if (!runtimeSet.size) {
+              return
+            }
             const groupedEntries = getGroupedEntries(Object.entries(assets))
             if (Array.isArray(groupedEntries.html) && groupedEntries.html.length) {
               for (let i = 0; i < groupedEntries.html.length; i++) {