feat(core): brand new swizzle CLI experience #6243
Conversation
|
✔️ [V2] 🔨 Explore the source changes: 3da40a8 🔍 Inspect the deploy log: https://app.netlify.com/sites/docusaurus-2/deploys/6218cf29b8cf2c0008ece161 😎 Browse the preview: https://deploy-preview-6243--docusaurus-2.netlify.app |
|
⚡️ Lighthouse report for the changes in this PR:
Lighthouse ran on https://deploy-preview-6243--docusaurus-2.netlify.app/ |
|
Size Change: +471 B (0%) Total Size: 783 kB
ℹ️ View Unchanged
|
|
Let's implement |
# Conflicts: # website/package.json
|
LGTM @slorber I think we can merge it today |
| @@ -4,9 +4,11 @@ description: Customize your site's appearance through creating your own theme co | |||
|
|
|||
| # Swizzling | |||
|
|
|||
| When [styling with CSS](./styling-layout.md) is not enough, **swizzling** comes into play. | |||
| In this section, we will introduce how customization of layout is done in Docusaurus. | |||
There was a problem hiding this comment.
It's not particularly about layouts, you can swizzle design system components too (or at least you will be able to)
There was a problem hiding this comment.
Design systems are still "layouts"... Maybe "appearance" is better?
| @@ -80,7 +76,7 @@ export async function eject({ | |||
|
|
|||
| await fs.ensureDir(toPath); | |||
|
|
|||
| async function copyFile(sourceFile: string) { | |||
| const createdFiles = await Promise.all(filesToCopy.map(async (sourceFile: string) => { | |||
There was a problem hiding this comment.
this kind of separation is done on purpose, it's clean code to separe low-level from high-level.
There was a problem hiding this comment.
It makes scanning code a bit harder for me for little reason... I prefer to see that await Promise.all() as one syntactic construct about working on an array of promises, so this code still reads idiomatic to me
There was a problem hiding this comment.
It makes scanning code harder for me and many others
In the future, I'd prefer if you apply clean code rules even if you don't agree with this one
http://principles-wiki.net/principles:single_level_of_abstraction
https://www.tripled.io/27/09/2016/Levels-of-abstraction/
website/docs/swizzling.md
Outdated
|
|
||
| > Déja vu...? | ||
|
|
||
| This section is similar to [Styling and Layout](./styling-layout.md), but this time, we are going to write actual React code and go deeper into the internals instead of playing with stylesheets. We will talk about a central concept in Docusaurus customization: **swizzling**, swizzling allows **deeper site customizations** through **React components**. |
There was a problem hiding this comment.
🤷♂️ I don't know, I prefer the former shorter version. Why make the text longer if it does not convey more info?
We don't go deeper into the internals, it is an official public feature and only unsafe components are internal
And not sure it's ok to say "playing with stylesheets" 😅
There was a problem hiding this comment.
Writing code is considered "internal". This is the only section in the Guides that asks readers to write actual code.
| @@ -120,6 +120,10 @@ function success(msg: unknown, ...values: InterpolatableValue[]): void { | |||
| ); | |||
| } | |||
|
|
|||
| function newLine(): void { | |||
There was a problem hiding this comment.
should we remove this?
I like adding linebreaks in CLI to make output more readable
There was a problem hiding this comment.
IDK, I found one place where it makes some sense, but mostly we can just write logger.info('\n...\n')
unfortunately npm2yarn does not remove it yet :( requires nebrelbug/npm-to-yarn#22
slorber
changed the title
Motivation
--ejectand--wrapoptions--listoption: exit with list when no extra args are given; otherwise, enter an interactive choosing mode.This would be a preparation for #6114.
Closes #5380
Docs
Have you read the Contributing Guidelines on pull requests?
Yes
Test Plan
Local tests