Skip to content
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.

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

feat(ant-design-vue): support css-in-js import style #703

Merged
merged 7 commits into from
May 1, 2024

Conversation

JohnsonHuang4396
Copy link
Contributor

Description

Support Ant-Design Vue 4.x

Previously, AntDesignVueResolver could only import CSS files, but now supports the introduction of CSS inJS files

Linked Issues

Additional context

@stackblitz
Copy link

stackblitz bot commented Sep 27, 2023

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

@JohnsonHuang4396
Copy link
Contributor Author

Found this is no need ToT

@ycs77
Copy link
Contributor

ycs77 commented Nov 13, 2023

I upgraded to ant-design-vue v4 and had an error:

[vite]: Rollup failed to resolve import "ant-design-vue/es/config-provider/style/css" from "D:/src/App.vue?vue&type=
script&setup=true&lang.ts".
This is most likely unintended because it can break your application at runtime.
If you do want to externalize this module explicitly add it to
`build.rollupOptions.external`

Now I using the less import style to fix it temporarily:

AntDesignVueResolver({
  importStyle: 'less',
}),

I think this PR could fix it, @JohnsonHuang4396 could you reopen it?

@ycs77
Copy link
Contributor

ycs77 commented Nov 13, 2023

And now the ant-design-vue latest version is v4, could you set the importStyle default to CSSinJS?

@JohnsonHuang4396
Copy link
Contributor Author

I'm glad that this PR is helpful to you, but I think the CSSinJS option is exactly the same as the Less option, just with different name. But I can't figure out a better way, so I closed this PR.
Maybe you could give me some clue?🧐

@ycs77
Copy link
Contributor

ycs77 commented Nov 14, 2023

Thanks for the response. I think that although the functionality is the same, the option value still has meaning to the user. Just like for package users "less" and "CSSinJS" are different. 🤔

src/core/resolvers/antdv.ts Outdated Show resolved Hide resolved
@antfu antfu changed the title feat: ant-design-vue 4.x support feat(ant-design-vue): support css-in-js import style May 1, 2024
@antfu antfu merged commit 5d533b1 into unplugin:main May 1, 2024
2 checks passed
hiifong referenced this pull request in hiifong/Mojito-UI May 1, 2024
[![Mend
Renovate](https://app.renovatebot.com/images/banner.svg)](https://renovatebot.com)

This PR contains the following updates:

| Package | Change | Age | Adoption | Passing | Confidence |
|---|---|---|---|---|---|
|
[unplugin-vue-components](https://github.com/unplugin/unplugin-vue-components)
| [`^0.26.0` ->
`^0.27.0`](https://renovatebot.com/diffs/npm/unplugin-vue-components/0.26.0/0.27.0)
|
[![age](https://developer.mend.io/api/mc/badges/age/npm/unplugin-vue-components/0.27.0?slim=true)](https://docs.renovatebot.com/merge-confidence/)
|
[![adoption](https://developer.mend.io/api/mc/badges/adoption/npm/unplugin-vue-components/0.27.0?slim=true)](https://docs.renovatebot.com/merge-confidence/)
|
[![passing](https://developer.mend.io/api/mc/badges/compatibility/npm/unplugin-vue-components/0.26.0/0.27.0?slim=true)](https://docs.renovatebot.com/merge-confidence/)
|
[![confidence](https://developer.mend.io/api/mc/badges/confidence/npm/unplugin-vue-components/0.26.0/0.27.0?slim=true)](https://docs.renovatebot.com/merge-confidence/)
|

---

### Release Notes

<details>
<summary>unplugin/unplugin-vue-components
(unplugin-vue-components)</summary>

###
[`v0.27.0`](https://github.com/unplugin/unplugin-vue-components/releases/tag/v0.27.0)

[Compare
Source](https://github.com/unplugin/unplugin-vue-components/compare/v0.26.0...v0.27.0)

#####    🚀 Features

-   **ant-design-vue**:
- Support `css-in-js` import style  -  by
[@&#8203;JohnsonHuang4396](https://github.com/JohnsonHuang4396),
[@&#8203;antfu](https://github.com/antfu), **黄启浩** and
**JohnsonHuang** in
[https://github.com/unplugin/unplugin-vue-components/issues/703](https://github.com/unplugin/unplugin-vue-components/issues/703)
[<samp>(5d533)</samp>](https://github.com/unplugin/unplugin-vue-components/commit/5d533b1)
-   **idux**:
- Update idux resolver to support v2 version  -  by
[@&#8203;sallerli1](https://github.com/sallerli1), **李志超44657** and
[@&#8203;antfu](https://github.com/antfu) in
[https://github.com/unplugin/unplugin-vue-components/issues/722](https://github.com/unplugin/unplugin-vue-components/issues/722)
[<samp>(c1458)</samp>](https://github.com/unplugin/unplugin-vue-components/commit/c145885)
-   **prime-vue**:
- Update missing components  -  by
[@&#8203;evgeniikostiukov](https://github.com/evgeniikostiukov) in
[https://github.com/unplugin/unplugin-vue-components/issues/735](https://github.com/unplugin/unplugin-vue-components/issues/735)
[<samp>(b9140)</samp>](https://github.com/unplugin/unplugin-vue-components/commit/b9140de)
- Add missing components  -  by
[@&#8203;tugcekucukoglu](https://github.com/tugcekucukoglu) and
[@&#8203;antfu](https://github.com/antfu) in
[https://github.com/unplugin/unplugin-vue-components/issues/731](https://github.com/unplugin/unplugin-vue-components/issues/731)
[<samp>(858ce)</samp>](https://github.com/unplugin/unplugin-vue-components/commit/858ce68)
-   **varlet-ui**:
- Support `styleExtname` option  -  by
[@&#8203;RSS1102](https://github.com/RSS1102) in
[https://github.com/unplugin/unplugin-vue-components/issues/740](https://github.com/unplugin/unplugin-vue-components/issues/740)
[<samp>(c0e66)</samp>](https://github.com/unplugin/unplugin-vue-components/commit/c0e66f3)

#####    🐞 Bug Fixes

- Move `prettier-ignore` statement so it works  -  by
[@&#8203;HookyGV](https://github.com/HookyGV) in
[https://github.com/unplugin/unplugin-vue-components/issues/729](https://github.com/unplugin/unplugin-vue-components/issues/729)
[<samp>(e0d37)</samp>](https://github.com/unplugin/unplugin-vue-components/commit/e0d37b0)
- **utils**: Collapse prefixes in PascalCase name  -  by
[@&#8203;waynzh](https://github.com/waynzh) in
[https://github.com/unplugin/unplugin-vue-components/issues/744](https://github.com/unplugin/unplugin-vue-components/issues/744)
[<samp>(02712)</samp>](https://github.com/unplugin/unplugin-vue-components/commit/027128c)

#####     [View changes on
GitHub](https://github.com/unplugin/unplugin-vue-components/compare/v0.26.0...v0.27.0)

</details>

---

### Configuration

📅 **Schedule**: Branch creation - At any time (no schedule defined),
Automerge - At any time (no schedule defined).

🚦 **Automerge**: Disabled by config. Please merge this manually once you
are satisfied.

♻ **Rebasing**: Whenever PR becomes conflicted, or you tick the
rebase/retry checkbox.

🔕 **Ignore**: Close this PR and you won't be reminded about this update
again.

---

- [ ] <!-- rebase-check -->If you want to rebase/retry this PR, check
this box

---

This PR has been generated by [Mend
Renovate](https://www.mend.io/free-developer-tools/renovate/). View
repository job log
[here](https://developer.mend.io/github/hiifong/gitno-ui).

<!--renovate-debug:eyJjcmVhdGVkSW5WZXIiOiIzNy4zMzEuMCIsInVwZGF0ZWRJblZlciI6IjM3LjMzMS4wIiwidGFyZ2V0QnJhbmNoIjoibWFpbiIsImxhYmVscyI6W119-->

Co-authored-by: renovate[bot] <29139614+renovate[bot]@users.noreply.github.com>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

3 participants