Skip to content

Commit

Permalink
Simplify integration to setup postcss + css import
Browse files Browse the repository at this point in the history
  • Loading branch information
TomPichaud committed Apr 1, 2023
1 parent 8a8be42 commit 4a515e3
Show file tree
Hide file tree
Showing 4 changed files with 17 additions and 224 deletions.
5 changes: 5 additions & 0 deletions .changeset/real-spies-pretend.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,5 @@
---
'@astrojs/tailwind': major
---

Remove redundant work
5 changes: 1 addition & 4 deletions packages/integrations/tailwind/package.json
Original file line number Diff line number Diff line change
Expand Up @@ -28,9 +28,6 @@
"dev": "astro-scripts dev \"src/**/*.ts\""
},
"dependencies": {
"@proload/core": "^0.3.2",
"@proload/plugin-typescript": "^0.2.1",
"@swc/core": "^1.3.44",
"autoprefixer": "^10.4.14",
"postcss": "^8.4.14",
"postcss-load-config": "^4.0.1"
Expand All @@ -43,7 +40,7 @@
},
"peerDependencies": {
"astro": "workspace:^2.1.9",
"tailwindcss": "^3.0.24"
"tailwindcss": "^3.3.1"
},
"pnpm": {
"peerDependencyRules": {
Expand Down
54 changes: 10 additions & 44 deletions packages/integrations/tailwind/src/index.ts
Original file line number Diff line number Diff line change
@@ -1,47 +1,8 @@
import load, { resolve } from '@proload/core';
import typescript from '@proload/plugin-typescript';

import type { AstroIntegration } from 'astro';
import autoprefixerPlugin from 'autoprefixer';
import path from 'path';
import tailwindPlugin, { type Config as TailwindConfig } from 'tailwindcss';
import resolveConfig from 'tailwindcss/resolveConfig.js';
import { fileURLToPath } from 'url';
import type { CSSOptions, UserConfig } from 'vite';

function getDefaultTailwindConfig(srcUrl: URL): TailwindConfig {
return resolveConfig({
content: [path.join(fileURLToPath(srcUrl), `**`, `*.{astro,html,js,jsx,svelte,ts,tsx,vue}`)],
}) as TailwindConfig;
}

async function getUserConfig(root: URL, srcDir: URL, configPath?: string) {
const resolvedRoot = fileURLToPath(root);
let userConfigPath: string | undefined;

if (configPath) {
const configPathWithLeadingSlash = /^\.*\//.test(configPath) ? configPath : `./${configPath}`;
userConfigPath = fileURLToPath(new URL(configPathWithLeadingSlash, root));
}

load.use([typescript]);

try {
const resolvedConfigPath = await resolve('tailwind', {
mustExist: true,
cwd: resolvedRoot,
filePath: userConfigPath,
});
return { config: resolvedConfigPath as string };
} catch (err) {
if (configPath) {
console.error(
`Could not find a Tailwind config at ${JSON.stringify(configPath)}. Does the file exist?`
);
}
return getDefaultTailwindConfig(srcDir);
}
}
import type { CSSOptions, UserConfig } from 'vite';

async function getPostCssConfig(
root: UserConfig['root'],
Expand All @@ -62,7 +23,7 @@ async function getPostCssConfig(
}

async function getViteConfiguration(
tailwindConfig: TailwindConfig | { config: string },
tailwindConfig: TailwindConfig | { config: string } | undefined,
viteConfig: UserConfig
) {
// We need to manually load postcss config files because when inlining the tailwind and autoprefixer plugins,
Expand Down Expand Up @@ -113,11 +74,16 @@ export default function tailwindIntegration(options?: TailwindOptions): AstroInt
name: '@astrojs/tailwind',
hooks: {
'astro:config:setup': async ({ config, updateConfig, injectScript }) => {
const userConfig = await getUserConfig(config.root, config.srcDir, customConfigPath);

// Inject the Tailwind postcss plugin
updateConfig({
vite: await getViteConfiguration(userConfig, config.vite as UserConfig),
vite: await getViteConfiguration(
customConfigPath
? {
config: customConfigPath,
}
: void 0,
config.vite as UserConfig
),
});

if (applyBaseStyles) {
Expand Down
177 changes: 1 addition & 176 deletions pnpm-lock.yaml

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

0 comments on commit 4a515e3

Please sign in to comment.