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

NEXT: Skeleton v3 Migration CLI #2972

Open
wants to merge 43 commits into
base: next
Choose a base branch
from
Open

Conversation

Hugos68
Copy link
Contributor

@Hugos68 Hugos68 commented Nov 17, 2024

Linked Issue

No issue (perhaps we should create one)

Description

Introduces the official Skeleton CLI that currently features:

  • A migration tool

Changsets

Instructions: Changesets automate our changelog. If you modify files in /packages, run pnpm changeset in the root of the monorepo, follow the prompts, then commit the markdown file. Changes that add features should be minor while chores and bugfixes should be patch. Please prefix the changeset message with feat:, bugfix: or chore:.

Checklist

Please read and apply all contribution requirements.

  • This PR targets the dev branch (NEVER master)
  • Documentation reflects all relevant changes
  • Branch is prefixed with: docs/, feat/, chore/, bugfix/
  • Ensure Svelte and Typescript linting is current - run pnpm ci:check
  • Ensure Prettier linting is current - run pnpm format
  • All test cases are passing - run pnpm test
  • Includes a changeset (if relevant; see above)

Copy link

changeset-bot bot commented Nov 17, 2024

⚠️ No Changeset found

Latest commit: 8489757

Merging this PR will not cause a version bump for any packages. If these changes should not result in a new version, you're good to go. If these changes should result in a version bump, you need to add a changeset.

This PR includes no changesets

When changesets are added to this PR, you'll see the packages that this PR includes changesets for and the associated semver types

Click here to learn what changesets are, and how to add one.

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

Copy link

vercel bot commented Nov 17, 2024

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

Name Status Preview Updated (UTC)
skeleton-docs ❌ Failed (Inspect) Nov 26, 2024 0:38am

Copy link

vercel bot commented Nov 17, 2024

@Hugos68 is attempting to deploy a commit to the Skeleton Labs Team on Vercel.

A member of the Team first needs to authorize it.

Copy link
Contributor

@endigo9740 endigo9740 left a comment

Choose a reason for hiding this comment

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

@Hugos68 everything is looking great. Just a few bits of feedback so far.


const TAILWIND_COMPONENT_REGEXES = [
{
find: /\bcard\b(?!.*bg-)/g,
Copy link
Contributor

@endigo9740 endigo9740 Nov 25, 2024

Choose a reason for hiding this comment

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

Just as a heads up - we need to ensure we don't just blindly insert the background class for .card migrations. It should only be added if no existing bg- class is found in the class list.

Imagine a scenario like this in a v2 project:

<div class="card bg-primary-400-500">...</div>

The card already has a background established, but the migration would insert our additional (and undesired) background class:

<div class="card bg-surface-100-900-token bg-primary-500 dark:bg-primary-500">...</div>

In this case, no migration should have occurred for this instance.

Copy link
Contributor Author

Choose a reason for hiding this comment

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

We can't migrate that then, there is no way to detect wether bg- is present or not as it can be added in a million ways.
For example class="card {bgClasses}", I'd say we skip this and/or migrate the card class without a background by default.

Copy link
Contributor

Choose a reason for hiding this comment

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

Potential solution from Discord. Append folk's global stylesheet and add the following:

/* SKETON CLI - appended this to ensure backwards combability. Please remove and update your `.card` usage. */

.card { @apply bg-surface-100-900; }

Just FYI, a gotcha with the global stylesheet is the extension varies in my experience. I've seen several options:

  • app.postcss
  • app.pcss
  • app.css

packages/cli/src/commands/migrate/migrations/skeleton-3.ts Outdated Show resolved Hide resolved
@endigo9740
Copy link
Contributor

@Hugos68 I'm going to be going through and update all project dependencies for the Skeleton monorepo per:

Can you please make sure the migration CLI is updated to support Node 22 - assuming it's not already! Otherwise disregard this message.

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.

2 participants