Skip to content

feat: add Vite plugin#41

Merged
layershifter merged 1 commit into
microsoft:mainfrom
layershifter:feat/add-vite-plugin
Jan 23, 2024
Merged

feat: add Vite plugin#41
layershifter merged 1 commit into
microsoft:mainfrom
layershifter:feat/add-vite-plugin

Conversation

@layershifter

@layershifter layershifter commented Feb 21, 2022 •
edited
Loading

Copy link
Copy Markdown
Member

Fixes #33.

This PR adds a plugin for Vite that implements AOT support. CSS extraction is not supported by this plugin yet.

Installation

# npm
npm i -D @griffel/tag-processor @griffel/vite-plugin
# yarn
yarn add --dev @griffel/tag-processor @griffel/vite-plugin
# pnpm
pnpm add -D @griffel/tag-processor @griffel/vite-plugin

Usage

After installation, add the plugin to your vite.config.js:

import { defineConfig } from 'vite';
import griffel from '@griffel/vite-plugin';

export default defineConfig({
  // ...
  plugins: [griffel()],
});

@layershifter layershifter mentioned this pull request Feb 21, 2022
Closed
@layershifter layershifter force-pushed the feat/add-vite-plugin branch from 3f72ff1 to afee939 Compare March 21, 2022 13:52
@layershifter

This comment was marked as outdated.

Sign in to view
@tsingson

tsingson commented Feb 12, 2023

Copy link
Copy Markdown

afee939

any update about add-vite-plugin ??

@layershifter

This comment was marked as outdated.

Sign in to view
@layershifter layershifter reopened this Dec 8, 2023
@layershifter layershifter force-pushed the feat/add-vite-plugin branch 2 times, most recently from 1f10da1 to 2a3c965 Compare December 8, 2023 16:27
@github-actions

github-actions Bot commented Dec 8, 2023 •
edited
Loading

Copy link
Copy Markdown
Contributor

📊 Bundle size report

Unchanged fixtures
Package & Exports Size (minified/GZIP)
core
__resetStyles (makeResetStyles)		 273 B
197 B
core
__styles (makeStyles)		 1.662 kB
793 B
core
makeResetStyles (runtime)		 17.14 kB
6.569 kB
core
makeStyles (runtime)		 21.651 kB
8.202 kB
core
mergeClasses		 1.821 kB
876 B
core
shorthands.padding()		 4.781 kB
1.537 kB
react
__css		 1.658 kB
774 B
react
__styles		 3.776 kB
1.668 kB
react
makeResetStyles (runtime)		 19.285 kB
7.429 kB
react
makeStaticStyles (runtime)		 9.225 kB
4.051 kB
react
makeStyles (runtime)		 23.803 kB
9.044 kB
shadow-dom
createShadowDOMRenderer		 3.468 kB
1.467 kB
🤖 This report was generated against 45e2a6b41596862bc2c54efbcbe746dc041e025e

@layershifter layershifter mentioned this pull request Dec 11, 2023
Merged
layershifter added a commit to layershifter/office-ui-fabric-react that referenced this pull request Dec 11, 2023
@layershifter
chore(react-components): add "wyw-in-js" field for tag processor
e5d525b 
Adds `wyw-in-js` field to `package.json` to support styles processing with WyW-in-JS compiler (https://wyw-in-js.dev/). The plan is to use this compiler for Vite/esbuild plugins (microsoft/griffel#41) and later switch our Webpack loader to it (microsoft/griffel#414).
@layershifter layershifter mentioned this pull request Dec 11, 2023
Merged
layershifter added a commit to microsoft/fluentui that referenced this pull request Dec 15, 2023
@layershifter
chore(react-components): add "wyw-in-js" field for tag processor (#30032
843f768 
)

Adds `wyw-in-js` field to `package.json` to support styles processing with WyW-in-JS compiler (https://wyw-in-js.dev/). The plan is to use this compiler for Vite/esbuild plugins (microsoft/griffel#41) and later switch our Webpack loader to it (microsoft/griffel#414).
@layershifter layershifter force-pushed the feat/add-vite-plugin branch 4 times, most recently from 72e4e26 to ce96d2e Compare January 23, 2024 10:26
@layershifter layershifter marked this pull request as ready for review January 23, 2024 10:34
@layershifter layershifter requested a review from a team as a code owner January 23, 2024 10:34
@layershifter layershifter merged commit 3d8d4f3 into microsoft:main Jan 23, 2024
@layershifter layershifter deleted the feat/add-vite-plugin branch January 23, 2024 10:38
This was referenced Jan 23, 2024
Merged
Open
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Reviewers

No reviews

Assignees

No one assigned

Labels

None yet

Projects

None yet

Milestone

No milestone

Development

Successfully merging this pull request may close these issues.

vite: Add plugin for Vite

2 participants

@layershifter @tsingson