Skip to content

feat: defineStyleX, close #821 #823

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom
Merged
merged 22 commits into from
Oct 14, 2024
Merged

feat: defineStyleX, close #821 #823

merged 22 commits into from
Oct 14, 2024

Conversation

BeiyanYunyi
Copy link
Contributor

@BeiyanYunyi BeiyanYunyi commented Sep 25, 2024 •
edited
Loading

Description

This Pull Request introduce defineStyleX macro and v-style directive to improve developing experience of <script setup> and StyleX.

Linked Issues

#821

Additional context

Volar support is not completed so far, as we have no intelliSense to v-stylex. I've tried to implement this, but I failed. Done

Zh-Hans document will be commited after discussing. Done

@bolt-new-by-stackblitz Bolt.new (by StackBlitz)
Copy link

Review PR in StackBlitz Codeflow Run & review this pull request in StackBlitz Codeflow.

@changeset-bot changeset-bot
Copy link

changeset-bot bot commented Sep 25, 2024 •
edited
Loading

🦋 Changeset detected

Latest commit: 3828a08

The changes in this PR will be included in the next version bump.

This PR includes changesets to release 33 packages
Name Type
@vue-macros/define-stylex Minor
@vue-macros/common Minor
@vue-macros/config Minor
unplugin-vue-macros Minor
@vue-macros/api Patch
@vue-macros/better-define Patch
@vue-macros/boolean-prop Patch
@vue-macros/chain-call Patch
@vue-macros/define-emit Patch
@vue-macros/define-models Patch
unplugin-vue-define-options Patch
@vue-macros/define-prop Patch
@vue-macros/define-props-refs Patch
@vue-macros/define-props Patch
@vue-macros/define-render Patch
@vue-macros/define-slots Patch
@vue-macros/export-expose Patch
@vue-macros/export-props Patch
@vue-macros/export-render Patch
@vue-macros/hoist-static Patch
@vue-macros/jsx-directive Patch
@vue-macros/named-template Patch
@vue-macros/nuxt Patch
@vue-macros/reactivity-transform Patch
@vue-macros/script-lang Patch
@vue-macros/setup-block Patch
@vue-macros/setup-component Patch
@vue-macros/setup-sfc Patch
@vue-macros/short-bind Patch
@vue-macros/short-emits Patch
@vue-macros/short-vmodel Patch
@vue-macros/volar Patch
@vue-macros/astro Patch

Not sure what this means? Click here to learn what changesets are.

Click here if you're a maintainer who wants to add another changeset to this PR

@vercel Vercel
Copy link

vercel bot commented Sep 25, 2024 •
edited
Loading

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name Status Preview Updated (UTC)
vue-macros ✅ Ready (Inspect) Visit Preview Oct 14, 2024 3:32pm

@dosubot dosubot bot added size:XL This PR changes 500-999 lines, ignoring generated files. enhancement New feature or request volar labels Sep 25, 2024
@pkg-pr-new pkg.pr.new
Copy link

pkg-pr-new bot commented Sep 25, 2024 •
edited
Loading

Open in Stackblitz

@vue-macros/api

pnpm add https://pkg.pr.new/vue-macros/vue-macros/@vue-macros/api@823

@vue-macros/astro

pnpm add https://pkg.pr.new/vue-macros/vue-macros/@vue-macros/astro@823

@vue-macros/better-define

pnpm add https://pkg.pr.new/vue-macros/vue-macros/@vue-macros/better-define@823

@vue-macros/boolean-prop

pnpm add https://pkg.pr.new/vue-macros/vue-macros/@vue-macros/boolean-prop@823

@vue-macros/chain-call

pnpm add https://pkg.pr.new/vue-macros/vue-macros/@vue-macros/chain-call@823

@vue-macros/common

pnpm add https://pkg.pr.new/vue-macros/vue-macros/@vue-macros/common@823

@vue-macros/config

pnpm add https://pkg.pr.new/vue-macros/vue-macros/@vue-macros/config@823

@vue-macros/define-emit

pnpm add https://pkg.pr.new/vue-macros/vue-macros/@vue-macros/define-emit@823

@vue-macros/define-models

pnpm add https://pkg.pr.new/vue-macros/vue-macros/@vue-macros/define-models@823

@vue-macros/define-prop

pnpm add https://pkg.pr.new/vue-macros/vue-macros/@vue-macros/define-prop@823

unplugin-vue-define-options

pnpm add https://pkg.pr.new/vue-macros/vue-macros/unplugin-vue-define-options@823

@vue-macros/define-props

pnpm add https://pkg.pr.new/vue-macros/vue-macros/@vue-macros/define-props@823

@vue-macros/define-props-refs

pnpm add https://pkg.pr.new/vue-macros/vue-macros/@vue-macros/define-props-refs@823

@vue-macros/define-render

pnpm add https://pkg.pr.new/vue-macros/vue-macros/@vue-macros/define-render@823

@vue-macros/define-slots

pnpm add https://pkg.pr.new/vue-macros/vue-macros/@vue-macros/define-slots@823

@vue-macros/define-stylex

pnpm add https://pkg.pr.new/vue-macros/vue-macros/@vue-macros/define-stylex@823

@vue-macros/devtools

pnpm add https://pkg.pr.new/vue-macros/vue-macros/@vue-macros/devtools@823

@vue-macros/eslint-config

pnpm add https://pkg.pr.new/vue-macros/vue-macros/@vue-macros/eslint-config@823

@vue-macros/export-props

pnpm add https://pkg.pr.new/vue-macros/vue-macros/@vue-macros/export-props@823

@vue-macros/export-expose

pnpm add https://pkg.pr.new/vue-macros/vue-macros/@vue-macros/export-expose@823

@vue-macros/export-render

pnpm add https://pkg.pr.new/vue-macros/vue-macros/@vue-macros/export-render@823

@vue-macros/hoist-static

pnpm add https://pkg.pr.new/vue-macros/vue-macros/@vue-macros/hoist-static@823

@vue-macros/jsx-directive

pnpm add https://pkg.pr.new/vue-macros/vue-macros/@vue-macros/jsx-directive@823

unplugin-vue-macros

pnpm add https://pkg.pr.new/vue-macros/vue-macros/unplugin-vue-macros@823

@vue-macros/named-template

pnpm add https://pkg.pr.new/vue-macros/vue-macros/@vue-macros/named-template@823

@vue-macros/nuxt

pnpm add https://pkg.pr.new/vue-macros/vue-macros/@vue-macros/nuxt@823

@vue-macros/reactivity-transform

pnpm add https://pkg.pr.new/vue-macros/vue-macros/@vue-macros/reactivity-transform@823

@vue-macros/script-lang

pnpm add https://pkg.pr.new/vue-macros/vue-macros/@vue-macros/script-lang@823

@vue-macros/setup-block

pnpm add https://pkg.pr.new/vue-macros/vue-macros/@vue-macros/setup-block@823

@vue-macros/setup-component

pnpm add https://pkg.pr.new/vue-macros/vue-macros/@vue-macros/setup-component@823

@vue-macros/setup-sfc

pnpm add https://pkg.pr.new/vue-macros/vue-macros/@vue-macros/setup-sfc@823

@vue-macros/short-emits

pnpm add https://pkg.pr.new/vue-macros/vue-macros/@vue-macros/short-emits@823

@vue-macros/short-bind

pnpm add https://pkg.pr.new/vue-macros/vue-macros/@vue-macros/short-bind@823

@vue-macros/short-vmodel

pnpm add https://pkg.pr.new/vue-macros/vue-macros/@vue-macros/short-vmodel@823

@vue-macros/test-utils

pnpm add https://pkg.pr.new/vue-macros/vue-macros/@vue-macros/test-utils@823

@vue-macros/volar

pnpm add https://pkg.pr.new/vue-macros/vue-macros/@vue-macros/volar@823

commit: 3828a08

sxzz
sxzz reviewed Sep 26, 2024
View reviewed changes
@BeiyanYunyi BeiyanYunyi marked this pull request as draft September 26, 2024 09:55
sxzz
sxzz reviewed Oct 4, 2024
View reviewed changes
Copy link
Member

@sxzz sxzz left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

nodeTransforms is not compatible with Vue 2. Consider supporting Vue 3 only

@BeiyanYunyi
Copy link
Contributor Author

BeiyanYunyi commented Oct 4, 2024 •
edited
Loading

nodeTransforms is not compatible with Vue 2. Consider supporting Vue 3 only

But I've got the macro work on Vue2 playground.

图片

Now I'm just stucked in Volar support.

sxzz
sxzz reviewed Oct 4, 2024
View reviewed changes
@sxzz sxzz force-pushed the feat/define-stylex branch from 045f102 to ecb4cf1 Compare October 4, 2024 07:23
@sxzz sxzz marked this pull request as ready for review October 4, 2024 07:25
@BeiyanYunyi
Copy link
Contributor Author

BeiyanYunyi commented Oct 4, 2024 •
edited
Loading

TODO:

  • Intellisense for v-stylex directive
  • Type infer and hint for contents of v-stylex directive

@sxzz sxzz force-pushed the feat/define-stylex branch from 278c7c6 to 62a64d6 Compare October 4, 2024 08:07
BeiyanYunyi and others added 17 commits October 13, 2024 12:49
@BeiyanYunyi
test(define-stylex): add 2 test cases
8867384
@BeiyanYunyi
feat(define-stylex): add playground, auto import stylex
efc69a0
@BeiyanYunyi
docs(define-stylex): add docs for defineStyleX
6f6951b
@BeiyanYunyi
chore(changeset): add changeset
384fd8b
@BeiyanYunyi
style: fix lint
fa58b12
@BeiyanYunyi
feat(define-stylex): add vue2 types
fe99aae
@BeiyanYunyi
docs(define-stylex): update documents
85951a9
@BeiyanYunyi
feat(define-stylex): volar plugin
b26e5da
@BeiyanYunyi
fix(define-stylex): hmr bug
a2539f8
@sxzz @BeiyanYunyi
fix
57877a5
@BeiyanYunyi @sxzz
Update packages/define-stylex/src/core/index.ts
fee9d74 
Co-authored-by: Kevin Deng 三咲智子 <sxzz@sxzz.moe>
@sxzz @BeiyanYunyi
fix docs
bda2d9e
@BeiyanYunyi
fix(define-stylex): use satisfies
589c722
@BeiyanYunyi @LittleSound
feat(define-stylex): ✨ TypeScript / Volar support
116ccba 
Co-authored-by: Rizumu Ayaka <rizumu@ayaka.moe>
@BeiyanYunyi
docs(define-stylex): 📝 zh-Hans documentation
ebd1a51
@BeiyanYunyi
fix
56e5ecb
@BeiyanYunyi
chore(define-stylex): 🎨 modify changesets
f5c74fe
@BeiyanYunyi BeiyanYunyi marked this pull request as ready for review October 13, 2024 04:56
@dosubot dosubot bot added the lgtm This PR has been approved by a maintainer label Oct 14, 2024
@sxzz sxzz merged commit 0f146d0 into vue-macros:main Oct 14, 2024
7 of 8 checks passed
@github-actions github-actions bot mentioned this pull request Oct 14, 2024
Merged
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Reviewers

@sxzz sxzz sxzz approved these changes

Assignees
No one assigned
Labels
documentation Improvements or additions to documentation enhancement New feature or request lgtm This PR has been approved by a maintainer size:XL This PR changes 500-999 lines, ignoring generated files. volar
Projects
None yet
Milestone
No milestone
Development

Successfully merging this pull request may close these issues.
2 participants
@BeiyanYunyi @sxzz