Skip to content

Commit 6f99ed2

Browse files
chore: align migrate dependencies with sv (#376)
* use `picocolors` instead of `kleur` * use `@clack/prompts` instead of `prompts` * improve logs * changeset * migrate to prompt logging * add intro, outro and migration selection * changeset * fix docs / readme * Apply suggestions from code review Co-authored-by: Ben McCann <[email protected]> * Update packages/migrate/bin.js Co-authored-by: Ben McCann <[email protected]> * Update packages/migrate/migrations/app-state/index.js Co-authored-by: Ben McCann <[email protected]> * lint * make it work again * fix merge conflict --------- Co-authored-by: Ben McCann <[email protected]>
1 parent 3173bdc commit 6f99ed2

File tree

17 files changed

+339
-355
lines changed

17 files changed

+339
-355
lines changed

.changeset/dull-toys-share.md

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,5 @@
1+
---
2+
'svelte-migrate': patch
3+
---
4+
5+
chore: align dependencies with `sv`

.changeset/happy-singers-roll.md

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,5 @@
1+
---
2+
'svelte-migrate': minor
3+
---
4+
5+
feat: add ability to select migration to run

documentation/docs/20-commands/40-sv-migrate.md

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -8,6 +8,11 @@ Some migrations may annotate your codebase with tasks for completion that you ca
88

99
## Usage
1010

11+
```bash
12+
npx sv migrate
13+
```
14+
15+
You can also specify a migration directly via the CLI:
1116
```bash
1217
npx sv migrate [migration]
1318
```

packages/migrate/README.md

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -4,13 +4,13 @@ A CLI for migrating Svelte(Kit) codebases.
44

55
Run it directly using:
66

7-
```
8-
npx svelte-migrate [migration]
7+
```bash
8+
npx sv migrate
99
```
1010

11-
Or via the unified Svlete CLI with:
11+
You can also specify a migration directly via the CLI:
1212

13-
```
13+
```bash
1414
npx sv migrate [migration]
1515
```
1616

packages/migrate/bin.js

Lines changed: 25 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,8 @@
22
import fs from 'node:fs';
33
import process from 'node:process';
44
import { fileURLToPath } from 'node:url';
5-
import colors from 'kleur';
5+
import pc from 'picocolors';
6+
import * as p from '@clack/prompts';
67

78
const migration = process.argv[2];
89
const dir = fileURLToPath(new URL('.', import.meta.url));
@@ -11,17 +12,29 @@ const migrations = fs
1112
.readdirSync(`${dir}/migrations`)
1213
.filter((migration) => fs.existsSync(`${dir}/migrations/${migration}/index.js`));
1314

15+
const pkg = JSON.parse(fs.readFileSync(`${dir}/package.json`, 'utf8'));
16+
17+
p.intro(`Welcome to the svelte-migrate CLI! ${pc.gray(`(v${pkg.version})`)}`);
18+
1419
if (migrations.includes(migration)) {
15-
const { migrate } = await import(`./migrations/${migration}/index.js`);
16-
migrate();
20+
await run_migration(migration);
1721
} else {
18-
console.error(
19-
colors
20-
.bold()
21-
.red(
22-
`You must specify one of the following migrations: ${migrations.join(', ')}\n` +
23-
'If you expected this to work, try re-running the command with the latest svelte-migrate version:\n' +
24-
` npx svelte-migrate@latest ${migration}`
25-
)
26-
);
22+
if (migration) p.log.warning(pc.yellow(`Invalid migration "${migration}" provided.`));
23+
24+
const selectedMigration = await p.select({
25+
message: 'Which migration would you like to run?',
26+
options: migrations.map((x) => ({ value: x, label: x }))
27+
});
28+
29+
if (!p.isCancel(selectedMigration)) await run_migration(selectedMigration);
30+
}
31+
32+
p.outro("You're all set!");
33+
34+
/**
35+
* @param {string} migration
36+
*/
37+
async function run_migration(migration) {
38+
const { migrate } = await import(`./migrations/${migration}/index.js`);
39+
await migrate();
2740
}
Lines changed: 31 additions & 45 deletions
Original file line numberDiff line numberDiff line change
@@ -1,10 +1,10 @@
1-
import colors from 'kleur';
1+
import pc from 'picocolors';
22
import fs from 'node:fs';
33
import process from 'node:process';
4-
import prompts from 'prompts';
4+
import * as p from '@clack/prompts';
55
import semver from 'semver';
66
import glob from 'tiny-glob/sync.js';
7-
import { bail, check_git, update_svelte_file } from '../../utils.js';
7+
import { bail, check_git, migration_succeeded, update_svelte_file } from '../../utils.js';
88
import { transform_svelte_code, update_pkg_json } from './migrate.js';
99

1010
export async function migrate() {
@@ -16,66 +16,61 @@ export async function migrate() {
1616

1717
const svelte_dep = pkg.devDependencies?.svelte ?? pkg.dependencies?.svelte;
1818
if (svelte_dep && semver.validRange(svelte_dep) && semver.gtr('5.0.0', svelte_dep)) {
19-
console.log(
20-
colors
21-
.bold()
22-
.red('\nYou need to upgrade to Svelte version 5 first (`npx sv migrate svelte-5`).\n')
19+
p.log.error(
20+
pc.bold(pc.red('You need to upgrade to Svelte version 5 first (`npx sv migrate svelte-5`).'))
2321
);
2422
process.exit(1);
2523
}
2624

2725
const kit_dep = pkg.devDependencies?.['@sveltejs/kit'] ?? pkg.dependencies?.['@sveltejs/kit'];
2826
if (kit_dep && semver.validRange(kit_dep) && semver.gtr('2.0.0', kit_dep)) {
29-
console.log(
30-
colors
31-
.bold()
32-
.red('\nYou need to upgrade to SvelteKit version 2 first (`npx sv migrate sveltekit-2`).\n')
27+
p.log.error(
28+
pc.bold(
29+
pc.red('You need to upgrade to SvelteKit version 2 first (`npx sv migrate sveltekit-2`).')
30+
)
3331
);
3432
process.exit(1);
3533
}
3634

37-
console.log(
38-
colors
39-
.bold()
40-
.yellow(
41-
'\nThis will update files in the current directory\n' +
42-
"If you're inside a monorepo, don't run this in the root directory, rather run it in all projects independently.\n"
35+
p.log.warning(
36+
pc.bold(pc.yellow('This will update files in the current directory.')) +
37+
'\n' +
38+
pc.bold(
39+
pc.yellow(
40+
"If you're inside a monorepo, don't run this in the root directory, rather run it in all projects independently."
41+
)
4342
)
4443
);
4544

4645
const use_git = check_git();
4746

48-
const response = await prompts({
49-
type: 'confirm',
50-
name: 'value',
47+
const response = await p.confirm({
5148
message: 'Continue?',
52-
initial: false
49+
initialValue: false
5350
});
5451

55-
if (!response.value) {
52+
if (p.isCancel(response) || !response) {
5653
process.exit(1);
5754
}
5855

59-
const folders = await prompts({
60-
type: 'multiselect',
61-
name: 'value',
56+
const folders = await p.multiselect({
6257
message: 'Which folders should be migrated?',
63-
choices: fs
58+
options: fs
6459
.readdirSync('.')
6560
.filter(
6661
(dir) => fs.statSync(dir).isDirectory() && dir !== 'node_modules' && !dir.startsWith('.')
6762
)
6863
.map((dir) => ({ title: dir, value: dir, selected: true }))
6964
});
7065

71-
if (!folders.value?.length) {
66+
if (p.isCancel(folders) || !folders?.length) {
7267
process.exit(1);
7368
}
7469

7570
update_pkg_json();
7671

7772
// For some reason {folders.value.join(',')} as part of the glob doesn't work and returns less files
78-
const files = folders.value.flatMap(
73+
const files = folders.flatMap(
7974
/** @param {string} folder */ (folder) =>
8075
glob(`${folder}/**`, { filesOnly: true, dot: true })
8176
.map((file) => file.replace(/\\/g, '/'))
@@ -96,24 +91,15 @@ export async function migrate() {
9691
);
9792
}
9893

99-
console.log(colors.bold().green('✔ Your project has been migrated'));
100-
101-
console.log('\nRecommended next steps:\n');
102-
103-
const cyan = colors.bold().cyan;
104-
105-
const tasks = [
106-
"install the updated dependencies ('npm i' / 'pnpm i' / etc) " + use_git &&
107-
cyan('git commit -m "migration to $app/state"')
108-
].filter(Boolean);
109-
110-
tasks.forEach((task, i) => {
111-
console.log(` ${i + 1}: ${task}`);
112-
});
113-
114-
console.log('');
94+
/** @type {(s: string) => string} */
95+
const cyan = (s) => pc.bold(pc.cyan(s));
11596

97+
// TODO: use package-manager-detector here
98+
const tasks = ["install the updated dependencies ('npm i' / 'pnpm i' / etc)"];
11699
if (use_git) {
117-
console.log(`Run ${cyan('git diff')} to review changes.\n`);
100+
tasks.push(cyan('git commit -m "migration to $app/state"'));
101+
tasks.push(`Run ${cyan('git diff')} to review changes.`);
118102
}
103+
104+
migration_succeeded(tasks);
119105
}
Lines changed: 18 additions & 31 deletions
Original file line numberDiff line numberDiff line change
@@ -1,10 +1,10 @@
11
import fs from 'node:fs';
2-
import colors from 'kleur';
2+
import pc from 'picocolors';
33
import path from 'node:path';
44
import process from 'node:process';
5-
import prompts from 'prompts';
5+
import * as p from '@clack/prompts';
66
import { pathToFileURL } from 'node:url';
7-
import { bail, check_git } from '../../utils.js';
7+
import { bail, check_git, migration_succeeded } from '../../utils.js';
88
import { migrate_config } from './migrate_config.js';
99
import { migrate_pkg } from './migrate_pkg.js';
1010

@@ -16,24 +16,20 @@ export async function migrate() {
1616
bail('Please re-run this script in a directory with a package.json');
1717
}
1818

19-
console.log(
20-
colors
21-
.bold()
22-
.yellow(
23-
'\nThis will update your svelte.config.js and package.json in the current directory\n'
24-
)
19+
p.log.warning(
20+
pc.bold(
21+
pc.yellow('This will update your svelte.config.js and package.json in the current directory')
22+
)
2523
);
2624

2725
const use_git = check_git();
2826

29-
const response = await prompts({
30-
type: 'confirm',
31-
name: 'value',
27+
const response = await p.confirm({
3228
message: 'Continue?',
33-
initial: false
29+
initialValue: false
3430
});
3531

36-
if (!response.value) {
32+
if (p.isCancel(response) || !response) {
3733
process.exit(1);
3834
}
3935

@@ -57,25 +53,16 @@ export async function migrate() {
5753
migrate_config();
5854
}
5955

60-
console.log(colors.bold().green('✔ Your project has been migrated'));
56+
/** @type {(s: string) => string} */
57+
const cyan = (s) => pc.bold(pc.cyan(s));
6158

62-
console.log('\nRecommended next steps:\n');
59+
/** @type {string[]} */
60+
const tasks = [];
6361

64-
const cyan = colors.bold().cyan;
62+
if (use_git) tasks.push(cyan('git commit -m "migration to @sveltejs/package v2"'));
6563

66-
const tasks = [
67-
use_git && cyan('git commit -m "migration to @sveltejs/package v2"'),
68-
'Review the migration guide at https://github.com/sveltejs/kit/pull/8922',
69-
'Read the updated docs at https://svelte.dev/docs/kit/packaging'
70-
].filter(Boolean);
64+
tasks.push('Review the migration guide at https://github.com/sveltejs/kit/pull/8922');
65+
tasks.push('Read the updated docs at https://svelte.dev/docs/kit/packaging');
7166

72-
tasks.forEach((task, i) => {
73-
console.log(` ${i + 1}: ${task}`);
74-
});
75-
76-
console.log('');
77-
78-
if (use_git) {
79-
console.log(`Run ${cyan('git diff')} to review changes.\n`);
80-
}
67+
migration_succeeded;
8168
}

packages/migrate/migrations/package/migrate_config.js

Lines changed: 8 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,6 @@
1+
import * as p from '@clack/prompts';
12
import fs from 'node:fs';
2-
import colors from 'kleur';
3+
import pc from 'picocolors';
34
import MagicString from 'magic-string';
45
import ts from 'typescript';
56

@@ -8,10 +9,12 @@ export function migrate_config() {
89
const content = fs.readFileSync('svelte.config.js', 'utf8');
910
fs.writeFileSync('svelte.config.js', remove_package_from_config(content));
1011
} catch {
11-
console.log(
12-
colors
13-
.bold()
14-
.yellow('Could not remove package config from svelte.config.js, please remove it manually')
12+
p.log.warning(
13+
pc.bold(
14+
pc.yellow(
15+
'Could not remove package config from svelte.config.js, please remove it manually'
16+
)
17+
)
1518
);
1619
}
1720
}

packages/migrate/migrations/package/migrate_pkg.js

Lines changed: 10 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,7 @@
1+
import * as p from '@clack/prompts';
12
import fs from 'node:fs';
23
import path from 'node:path';
3-
import colors from 'kleur';
4+
import pc from 'picocolors';
45
import { guess_indent, posixify, walk } from '../../utils.js';
56

67
/**
@@ -58,8 +59,8 @@ export function update_pkg_json(config, pkg, files) {
5859

5960
// See: https://pnpm.io/package_json#publishconfigdirectory
6061
if (pkg.publishConfig?.directory || pkg.linkDirectory?.directory) {
61-
console.log(
62-
colors.yellow(
62+
p.log.warning(
63+
pc.yellow(
6364
'Detected "publishConfig.directory" or "linkDirectory.directory" fields in your package.json. ' +
6465
'This migration removes them, which may or may not be what you want. Please review closely.'
6566
)
@@ -101,8 +102,8 @@ export function update_pkg_json(config, pkg, files) {
101102
const key = `./${file.dest}`.replace(/\/index\.js$|(\/[^/]+)\.js$/, '$1');
102103

103104
if (clashes[key]) {
104-
console.log(
105-
colors.yellow(
105+
p.log.warning(
106+
pc.yellow(
106107
`Duplicate "${key}" export. Closely review your "exports" field in package.json after the migration.`
107108
)
108109
);
@@ -169,15 +170,15 @@ export function update_pkg_json(config, pkg, files) {
169170
if (svelte_export) {
170171
pkg.svelte = svelte_export;
171172
} else {
172-
console.log(
173-
colors.yellow(
173+
p.log.warning(
174+
pc.yellow(
174175
'Cannot generate a "svelte" entry point because the "." entry in "exports" is not a string. Please specify a "svelte" entry point yourself\n'
175176
)
176177
);
177178
}
178179
} else {
179-
console.log(
180-
colors.yellow(
180+
p.log.warning(
181+
pc.yellow(
181182
'Cannot generate a "svelte" entry point because the "." entry in "exports" is missing. Please specify a "svelte" entry point yourself\n'
182183
)
183184
);

0 commit comments

Comments
 (0)