Skip to content

Commit 1d8408d

Browse files
TheSonOfThompTheSonOfThomp
authored
Updates lg create [LG-4128] (#2787)
* Adds version nonce * Create emotion-nonce.md * adds fsx * Update pnpm-lock.yaml * Add verbose & dry to create * improve logging. Use parent to get scope * update create subcomponents * Create create-cli.md * update readme
1 parent 7f67389 commit 1d8408d

16 files changed

+344
-129
lines changed

‎.changeset/create-cli.md

+9
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,9 @@
1+
---
2+
'@lg-tools/create': minor
3+
'@lg-tools/cli': minor
4+
---
5+
6+
- Newly created `tsconfig.json` files will now take the scope into account, and update the references accordingly.
7+
- Root sub-component directory will now take `--parent` option into account (no longer need to specify `--directory` as well as `--parent`)
8+
- Adds `-dry` flag for dry runs
9+
- Improves verbose logging

‎.changeset/emotion-nonce.md

+5
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,5 @@
1+
---
2+
'@leafygreen-ui/emotion': minor
3+
---
4+
5+
Adds `nonce` property to debug and ensure consistent versions

‎tools/cli/src/index.ts

+13-3
Original file line numberDiff line numberDiff line change
@@ -26,15 +26,25 @@ cli
2626
.argument('<name>', 'The name of the package')
2727
.option(
2828
'-s, --scope [scope]',
29-
'The npm scope of the new package. Defaults to the first entry in lg.config.json scopes',
29+
`The npm scope of the new package. Valid scopes are defined in the \`package.json\` \`"lg.scopes"\` property. Defaults to the first entry in \`lg.scopes\`. The directory is determined by the mapping defined in \`lg.scopes\``,
3030
)
3131
.option(
3232
'-d, --directory [directory]',
33-
'The directory to write the new package. Defaults to the first entry in lg.config.json scopes',
33+
`The directory to write the new package. Defaults to mapped directory of \`--scope\``,
3434
)
3535
.option(
3636
'-p, --parent [parent]',
37-
'Creates a sub-component to the provided parent',
37+
'Identifies the parent component of the new component. Creates a sub-component to the provided parent.',
38+
)
39+
.option(
40+
'-v, --verbose',
41+
'Prints additional information to the console',
42+
false,
43+
)
44+
.option(
45+
'-d, --dry',
46+
'Run without making any changes to the filesystem',
47+
false,
3848
)
3949
.action(createPackage);
4050

‎tools/create/README.md

+52-1
Original file line numberDiff line numberDiff line change
@@ -6,6 +6,57 @@ Creates a new LeafyGreen package
66

77
Use from `@lg-tools/cli`:
88

9+
```zsh
10+
lg create <package-name>
11+
```
12+
13+
## Options
14+
15+
### Scope
16+
17+
`-s`, `--scope`
18+
19+
The npm scope of the new package. Valid scopes are defined in the `package.json` `"lg.scopes"` property.
20+
21+
Defaults to the first entry in `lg.scopes`.
22+
23+
The directory is determined by the mapping defined in `lg.scopes`
24+
25+
```bash
26+
# Create a new package in the @lg-charts scope
27+
lg create my-package --scope @lg-charts
28+
```
29+
30+
### Directory
31+
32+
`-d`, `--directory`
33+
34+
The directory to write the new package. Defaults to mapped directory of `--scope`.
35+
36+
```bash
37+
# Create a new package in ./components
38+
lg create my-package --directory './components'
39+
```
40+
41+
### Parent
42+
43+
`-p`, `--parent`
44+
45+
Identifies the parent component of the new component. Creates a sub-component to the provided parent.
46+
947
```bash
10-
> lg create <package-name>
48+
# Creates a new subcomponent of '@lg-charts/core'
49+
lg create my-package --parent '@lg-charts/core'
1150
```
51+
52+
### Dry
53+
54+
`-d`, `--dry`
55+
56+
Run without making any changes to the filesystem (default: `false`)
57+
58+
### Verbose
59+
60+
`-v`, `--verbose`
61+
62+
Prints additional information to the console (default: `false`)

‎tools/create/src/create.types.ts

+2
Original file line numberDiff line numberDiff line change
@@ -2,6 +2,8 @@ export interface CreatePackageOptions {
22
directory?: string;
33
scope?: string;
44
parent?: string;
5+
dry?: boolean;
6+
verbose?: boolean;
57
}
68

79
export interface TemplateParameters {

‎tools/create/src/createComponent.ts

+61-60
Original file line numberDiff line numberDiff line change
@@ -20,14 +20,17 @@ import {
2020
} from './templates';
2121

2222
interface CreateComponentArgs
23-
extends Pick<Required<CreatePackageOptions>, 'scope' | 'directory'> {
23+
extends Pick<Required<CreatePackageOptions>, 'scope' | 'directory'>,
24+
Omit<CreatePackageOptions, 'scope' | 'directory'> {
2425
name: string;
2526
}
2627

2728
export function createComponent({
2829
name,
2930
scope,
3031
directory,
32+
dry,
33+
verbose,
3134
}: CreateComponentArgs) {
3235
const rootDir = process.cwd();
3336

@@ -42,66 +45,64 @@ export function createComponent({
4245

4346
// Create the appropriate directory
4447
const packageDir = path.resolve(rootDir, directory, packageNameKebab);
48+
const doesPackageDirExist = fse.existsSync(packageDir);
4549

46-
// Create the package directories
47-
fse.mkdir(packageDir, { recursive: true }, err => {
48-
if (err) {
49-
console.log(`Package ${packageNameKebab} already exists`);
50-
return;
51-
}
50+
if (doesPackageDirExist) {
51+
throw new Error(`Package ${packageNameKebab} already exists`);
52+
}
5253

53-
// Write the appropriate files for each template
54-
writeFiles(
55-
[
56-
{
57-
name: 'package.json',
58-
contents: pkgJson({
59-
scope,
60-
packageNameKebab,
61-
packageNameTitle,
62-
}),
63-
},
64-
{
65-
name: 'tsconfig.json',
66-
contents: tsConfig,
67-
},
68-
{
69-
name: 'README.md',
70-
contents: readMe({ packageNameKebab, packageNameTitle }),
71-
},
72-
{
73-
name: 'src/index.ts',
74-
contents: index({ packageNamePascal }),
75-
},
76-
{
77-
name: `src/${packageNamePascal}.stories.tsx`,
78-
contents: story({ packageNamePascal }),
79-
},
80-
{
81-
name: `src/${packageNamePascal}/index.ts`,
82-
contents: componentIndex({ packageNamePascal }),
83-
},
84-
{
85-
name: `src/${packageNamePascal}/${packageNamePascal}.tsx`,
86-
contents: component({ packageNamePascal }),
87-
},
88-
{
89-
name: `src/${packageNamePascal}/${packageNamePascal}.spec.tsx`,
90-
contents: spec({ packageNamePascal, packageNameKebab }),
91-
},
92-
{
93-
name: `src/${packageNamePascal}/${packageNamePascal}.types.ts`,
94-
contents: types({ packageNamePascal }),
95-
},
96-
{
97-
name: `src/${packageNamePascal}/${packageNamePascal}.styles.ts`,
98-
contents: styles,
99-
},
100-
],
101-
{
102-
dir: packageDir,
103-
packageNamePascal,
104-
},
105-
);
54+
const filesToWrite = [
55+
{
56+
name: 'package.json',
57+
contents: pkgJson({
58+
scope,
59+
packageNameKebab,
60+
packageNameTitle,
61+
}),
62+
},
63+
{
64+
name: 'tsconfig.json',
65+
contents: tsConfig(scope),
66+
},
67+
{
68+
name: 'README.md',
69+
contents: readMe({ packageNameKebab, packageNameTitle }),
70+
},
71+
{
72+
name: 'src/index.ts',
73+
contents: index({ packageNamePascal }),
74+
},
75+
{
76+
name: `src/${packageNamePascal}.stories.tsx`,
77+
contents: story({ packageNamePascal }),
78+
},
79+
{
80+
name: `src/${packageNamePascal}/index.ts`,
81+
contents: componentIndex({ packageNamePascal }),
82+
},
83+
{
84+
name: `src/${packageNamePascal}/${packageNamePascal}.tsx`,
85+
contents: component({ packageNamePascal }),
86+
},
87+
{
88+
name: `src/${packageNamePascal}/${packageNamePascal}.spec.tsx`,
89+
contents: spec({ packageNamePascal, packageNameKebab }),
90+
},
91+
{
92+
name: `src/${packageNamePascal}/${packageNamePascal}.types.ts`,
93+
contents: types({ packageNamePascal }),
94+
},
95+
{
96+
name: `src/${packageNamePascal}/${packageNamePascal}.styles.ts`,
97+
contents: styles,
98+
},
99+
];
100+
101+
writeFiles(filesToWrite, {
102+
dir: packageDir,
103+
name,
104+
scope,
105+
dry,
106+
verbose,
106107
});
107108
}

‎tools/create/src/createSubComponent.ts

+42-37
Original file line numberDiff line numberDiff line change
@@ -9,19 +9,25 @@ import { writeFiles } from './utils/writeFiles';
99
import { CreatePackageOptions } from './create.types';
1010
import { component, componentIndex, spec, styles, types } from './templates';
1111

12-
interface CreateComponentArgs {
12+
interface CreateComponentArgs
13+
extends Omit<CreatePackageOptions, 'scope' | 'directory'> {
1314
name: string;
1415
parent: Required<CreatePackageOptions>['parent'];
1516
}
1617

17-
export function createSubComponent({ name, parent }: CreateComponentArgs) {
18-
const { packageNamePascal: parentNamePascal } = getNameVariants(parent);
18+
export function createSubComponent({
19+
name,
20+
parent,
21+
dry,
22+
verbose,
23+
}: CreateComponentArgs) {
24+
const { packageNameKebab: parentNameKebab } = getNameVariants(parent);
1925
const { packageNameKebab, packageNamePascal } = getNameVariants(name);
2026

2127
console.log(
2228
chalk.green(
2329
`Creating sub-component ${chalk.bold(
24-
parentNamePascal + '/' + packageNamePascal,
30+
parentNameKebab + '/' + packageNamePascal,
2531
)}`,
2632
),
2733
);
@@ -34,40 +40,39 @@ export function createSubComponent({ name, parent }: CreateComponentArgs) {
3440
}
3541

3642
const subComponentDir = path.resolve(parentDir, 'src', packageNamePascal);
43+
const doesSubComponentDirExist = fse.existsSync(subComponentDir);
3744

38-
fse.mkdir(subComponentDir, { recursive: true }, err => {
39-
if (err) {
40-
console.log(`Package ${packageNameKebab} already exists`);
41-
return;
42-
}
45+
if (doesSubComponentDirExist) {
46+
throw new Error(`Sub-component ${packageNameKebab} already exists`);
47+
}
48+
49+
const filesToWrite = [
50+
{
51+
name: `index.ts`,
52+
contents: componentIndex({ packageNamePascal }),
53+
},
54+
{
55+
name: `${packageNamePascal}.tsx`,
56+
contents: component({ packageNamePascal }),
57+
},
58+
{
59+
name: `${packageNamePascal}.spec.tsx`,
60+
contents: spec({ packageNamePascal, packageNameKebab }),
61+
},
62+
{
63+
name: `${packageNamePascal}.types.ts`,
64+
contents: types({ packageNamePascal }),
65+
},
66+
{
67+
name: `${packageNamePascal}.styles.ts`,
68+
contents: styles,
69+
},
70+
];
4371

44-
writeFiles(
45-
[
46-
{
47-
name: `index.ts`,
48-
contents: componentIndex({ packageNamePascal }),
49-
},
50-
{
51-
name: `${packageNamePascal}.tsx`,
52-
contents: component({ packageNamePascal }),
53-
},
54-
{
55-
name: `${packageNamePascal}.spec.tsx`,
56-
contents: spec({ packageNamePascal, packageNameKebab }),
57-
},
58-
{
59-
name: `${packageNamePascal}.types.ts`,
60-
contents: types({ packageNamePascal }),
61-
},
62-
{
63-
name: `${packageNamePascal}.styles.ts`,
64-
contents: styles,
65-
},
66-
],
67-
{
68-
dir: subComponentDir,
69-
packageNamePascal,
70-
},
71-
);
72+
writeFiles(filesToWrite, {
73+
dir: subComponentDir,
74+
name,
75+
dry,
76+
verbose,
7277
});
7378
}

0 commit comments

Comments
 (0)