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

Set up rollup and package json for SCSS #1491

Merged
merged 4 commits into from
Jul 13, 2023

Conversation

sungik-choi
Copy link
Contributor

@sungik-choi sungik-choi commented Jul 12, 2023

Self Checklist

  • I wrote a PR title in English.
  • I added an appropriate label to the PR.
  • I wrote a commit message in English.
  • I wrote a commit message according to the Conventional Commits specification.
  • I added the appropriate changeset for the changes.
  • [Component] I wrote a unit test about the implementation.
  • [Component] I wrote a storybook document about the implementation.
  • [Component] I tested the implementation in various browsers.
    • Windows: Chrome, Edge, (Optional) Firefox
    • macOS: Chrome, Edge, Safari, (Optional) Firefox
  • [New Component] I added my username to the correct directory in the CODEOWNERS file.

Related Issue

Summary

from b55b75d

SCSS module을 빌드할 수 있는 환경을 구성합니다

Details

  • rollup-plugin-postcss을 사용하여 빌드 환경을 구성했습니다. 21년 이후로 메인테이닝되고 있지 않는 라이브러리라 sass, postcss 를 사용하여 직접 롤업 플러그인을 구성하는 방법을 고려해보았지만, 1. 빠른 시간 안에 구현은 조금 어려울 듯하고 2. 해당 라이브러리로 원하는 동작이 충분히 잘 구현되어 라이브러리를 사용하기로 결정했습니다.
  • vendor prefix 지원을 위해 autoprefixer postcss 플러그인을 추가합니다. (+ 현재 브라우저 리스트 기준 vendor prefix가 필요한 케이스는 없음)
  • package json에 sideEffects와 exports를 추가하여 원치 않는 트리쉐이킹을 방지하고, 사용처에서 스타일시트에 접근할 수 있도록 합니다.

Breaking change or not (Yes/No)

Yes

이제 bezier-react에서 스타일 시트를 export 합니다. 앱의 루트에서 아래와 같이 스타일 시트를 import 해야합니다.

import '@channel.io/bezier-react/style.css'

References

@sungik-choi sungik-choi added build Issue or PR related to build system #styled-system feat Issue or PR related to a new feature labels Jul 12, 2023
@sungik-choi sungik-choi self-assigned this Jul 12, 2023
@changeset-bot
Copy link

changeset-bot bot commented Jul 12, 2023

🦋 Changeset detected

Latest commit: 5319a5f

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

This PR includes changesets to release 2 packages
Name Type
@channel.io/bezier-react Major
bezier-figma-plugin 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

@github-actions
Copy link
Contributor

github-actions bot commented Jul 12, 2023

Chromatic Report

🚀 Congratulations! Your build was successful!

@codecov
Copy link

codecov bot commented Jul 12, 2023

Codecov Report

Patch and project coverage have no change.

Comparison is base (c406f6b) 87.27% compared to head (5319a5f) 87.27%.

Additional details and impacted files
@@              Coverage Diff               @@
##           styled-system    #1491   +/-   ##
==============================================
  Coverage          87.27%   87.27%           
==============================================
  Files                279      279           
  Lines               3835     3835           
  Branches             806      806           
==============================================
  Hits                3347     3347           
  Misses               415      415           
  Partials              73       73           

☔ View full report in Codecov by Sentry.
📢 Do you have feedback about the report comment? Let us know in this issue.

@sungik-choi sungik-choi removed the request for review from quino0627 July 13, 2023 02:55
@sungik-choi sungik-choi merged commit c32ac6d into channel-io:styled-system Jul 13, 2023
4 checks passed
@sungik-choi sungik-choi deleted the feat/scss-build branch July 13, 2023 03:02
sungik-choi added a commit that referenced this pull request Jul 13, 2023
* feat(styles): add rollup-postcss-plugin and set up build config

* chore(pkg): add css files to side effects and sub path module

* chore(changeset): add changeset

* build(rollup): add custom generate scoped name string
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
build Issue or PR related to build system feat Issue or PR related to a new feature
Projects
None yet
Development

Successfully merging this pull request may close these issues.

1 participant