{"id":28541475,"url":"https://github.com/windicss/gridsome-plugin-windicss","last_synced_at":"2025-10-08T16:15:51.046Z","repository":{"id":52253428,"uuid":"350187490","full_name":"windicss/gridsome-plugin-windicss","owner":"windicss","description":"🍃 Windi CSS for Gridsome ⚡","archived":false,"fork":false,"pushed_at":"2022-07-11T00:31:25.000Z","size":645,"stargazers_count":7,"open_issues_count":0,"forks_count":1,"subscribers_count":2,"default_branch":"master","last_synced_at":"2025-09-17T00:54:41.088Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":null,"language":"Vue","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/windicss.png","metadata":{"files":{"readme":"README.md","changelog":"CHANGELOG.md","contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2021-03-22T02:57:17.000Z","updated_at":"2025-08-12T03:28:48.000Z","dependencies_parsed_at":"2022-08-31T09:00:11.873Z","dependency_job_id":null,"html_url":"https://github.com/windicss/gridsome-plugin-windicss","commit_stats":null,"previous_names":[],"tags_count":14,"template":false,"template_full_name":null,"purl":"pkg:github/windicss/gridsome-plugin-windicss","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/windicss%2Fgridsome-plugin-windicss","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/windicss%2Fgridsome-plugin-windicss/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/windicss%2Fgridsome-plugin-windicss/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/windicss%2Fgridsome-plugin-windicss/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/windicss","download_url":"https://codeload.github.com/windicss/gridsome-plugin-windicss/tar.gz/refs/heads/master","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/windicss%2Fgridsome-plugin-windicss/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":278974223,"owners_count":26078371,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","status":"online","status_checked_at":"2025-10-08T02:00:06.501Z","response_time":56,"last_error":null,"robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":true,"can_crawl_api":true,"host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":[],"created_at":"2025-06-09T20:08:46.334Z","updated_at":"2025-10-08T16:15:51.040Z","avatar_url":"https://github.com/windicss.png","language":"Vue","funding_links":[],"categories":[],"sub_categories":[],"readme":"\u003ch1 align='center'\u003egridsome-plugin-windicss\u003c/h1\u003e\n\n\u003cp align='center'\u003e\u003ca href=\"https://github.com/windicss/windicss\"\u003eWindi CSS\u003c/a\u003e for Gridsome, it's fast! ⚡️\u003cbr\u003e\n\u003csup\u003e\u003cem\u003ea.k.a On-demand Tailwind CSS\u003c/em\u003e\u003c/sup\u003e\n\u003c/p\u003e\n\n\u003cp align='center'\u003e\n\u003ca href='https://www.npmjs.com/package/gridsome-plugin-windicss'\u003e\n\u003cimg src='https://img.shields.io/npm/v/gridsome-plugin-windicss?color=0EA5E9\u0026label='\u003e\n\u003c/a\u003e\n\u003c/p\u003e\n\n\u003cp align='center'\u003e\n\u003ca href='https://twitter.com/antfu7/status/1361398324587163648'\u003e⚡️ See speed comparison with Tailwind\u003c/a\u003e\n\u003c/p\u003e\n\n## Features\n\n- ⚡️ **It's FAST** - 20~100x times faster than [gridsome-plugin-tailwindcss](https://github.com/brandonpittman/gridsome-plugin-tailwindcss)\n- 🧩 On-demand CSS utilities (Compatible with Tailwind CSS v2) and native elements style resetting\n- 🍃 Load configurations from `tailwind.config.js`\n- 📄 Use `@apply` / `@screen` directives in any file: Vue SFC, Less, SCSS, SASS, PostCSS, Stylus\n- 🎳 Support Utility Groups - e.g. `bg-gray-200 hover:(bg-gray-100 text-red-300)`\n\n## Install\n\n```bash\nyarn add gridsome-plugin-windicss -D\n# npm i gridsome-plugin-windicss -D\n```\n\n:warning: This module is a pre-release, please report any [issues](https://github.com/windicss/gridsome-plugin-windicss/issues) you find.\n\n## Usage\n\nWithin your `gridsome.config.js` add the following.\n\n```js\n// gridsome.config.js\nmodule.exports = {\n  // ...\n  plugins: [\n    {\n      use: 'gridsome-plugin-windicss',\n      options: {\n        // see https://github.com/windicss/vite-plugin-windicss/blob/main/packages/plugin-utils/src/options.ts\n      }\n    },\n  ],\n}\n```\n\nThis module won't work with `gridsome-plugin-tailwindcss`, you will need to remove it.\n\n```diff\n plugins: [\n    {\n-      use: 'gridsome-plugin-tailwindcss',\n-      options: {\n-        // ...\n-      }\n    },\n  ],\n```\n\nIf you have a `tailwind.config.js`, please rename it to `windi.config.js` or `windi.config.ts`.\n\nSee [here](https://windicss.netlify.app/guide/configuration.html) for configuration details.\n\n\n## Migrating\n\nIf you were previously using `gridsome-plugin-tailwindcss`, please consult the [documentation](https://windicss.netlify.app/guide/migration.html) on migrating.\n\n## Configuration\n\n- Default:\n```js\nexport default {\n  scan: {\n    dirs: ['./'],\n    exclude: [\n      'node_modules',\n      '.git',\n      'dist',\n      '.cache',\n      '.temp',\n    ],\n  },\n  preflight: {\n    alias: {\n      // add gridsome aliases\n      'g-link': 'a',\n      'g-image': 'img',\n    }\n  }\n}\n```  \n\n- See [options.ts](https://github.com/windicss/vite-plugin-windicss/blob/main/packages/plugin-utils/src/options.ts) for configuration reference.\n\n### Examples\n\n#### Disable Preflight\n\n_ngridsome.config.js_\n```js\nmodule.exports = {\n  // ...\n  plugins: [\n    {\n      use: 'gridsome-plugin-windicss',\n      options: {\n        preflight: false,\n      }\n    },\n  ],\n}\n```\n\n## Caveats\n\n### Scoped Style\n\n`@media` directive with scoped style can **only work** with `css` `postcss` `scss` but not `sass`, `less` nor `stylus`\n\n## Credits\n\n- Windy team\n- [@antfu](https://github.com/antfu) Based on his Rollup / Vite implementation \u0026 his util package\n\n## Sponsors\n\n\u003cp align=\"center\"\u003e\n  \u003ca href=\"https://raw.githubusercontent.com/harlan-zw/static/main/sponsors.svg\"\u003e\n    \u003cimg src='https://raw.githubusercontent.com/harlan-zw/static/main/sponsors.svg'/\u003e\n  \u003c/a\u003e\n\u003c/p\u003e\n\n## License\n\nMIT License © 2021 [Harlan Wilton](https://github.com/harlan-zw)\n\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fwindicss%2Fgridsome-plugin-windicss","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fwindicss%2Fgridsome-plugin-windicss","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fwindicss%2Fgridsome-plugin-windicss/lists"}