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

fix: migration cleanup #10195

Merged
merged 13 commits into from
Jun 21, 2023
5 changes: 5 additions & 0 deletions .changeset/forty-ears-beg.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,5 @@
---
'svelte-migrate': patch
---

fix: finalize svelte-4 migration
45 changes: 36 additions & 9 deletions packages/migrate/migrations/svelte-4/index.js
Original file line number Diff line number Diff line change
@@ -3,14 +3,14 @@ import fs from 'node:fs';
import prompts from 'prompts';
import glob from 'tiny-glob/sync.js';
import { bail, check_git } from '../../utils.js';
import { update_js_file, update_svelte_file } from './migrate.js';
import { update_js_file, update_pkg_json, update_svelte_file } from './migrate.js';

export async function migrate() {
if (!fs.existsSync('package.json')) {
bail('Please re-run this script in a directory with a package.json');
}

console.log(colors.bold().yellow('\nThis will update files in the current directory\n'));
console.log(colors.bold().yellow('\nThis will update files in the current src/ directory\n'));
Copy link
Contributor

Choose a reason for hiding this comment

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

Is the path configurable?

Outside of Kit projects I've usually seen people put svelte files in client, app, components...

Copy link
Member Author

Choose a reason for hiding this comment

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

It isn't right now. How could we go about it instead? Scan everything except node_modules / .svelte-kit or all things inside .gitignore? If a jsconfig/tsconfig exists and read the paths from there?

Copy link
Contributor

Choose a reason for hiding this comment

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

Probably keep it simple and add a clack prompt. The automated solutions would still miss things, whereas people can just order it to do the right thing for their codebase with an input.

Copy link
Contributor

Choose a reason for hiding this comment

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

Ahh, there is already a prompt for the transitions change. Great.


const use_git = check_git();

@@ -25,22 +25,49 @@ export async function migrate() {
process.exit(1);
}

const migrate_transition = await prompts({
type: 'confirm',
name: 'value',
message:
'Add the `|global` modifier to currently global transitions for backwards compatibility? More info at https://svelte.dev/docs/v4-migration-guide#transitions-are-local-by-default',
initial: true
});

const folders = await prompts({
dummdidumm marked this conversation as resolved.
Show resolved Hide resolved
type: 'multiselect',
name: 'value',
message: 'Which folders should be migrated?',
choices: fs
.readdirSync('.')
.filter(
(dir) => fs.statSync(dir).isDirectory() && dir !== 'node_modules' && !dir.startsWith('.')
)
.map((dir) => ({ title: dir, value: dir, selected: true }))
});

if (!folders.value?.length) {
process.exit(1);
}

update_pkg_json();

// const { default: config } = fs.existsSync('svelte.config.js')
// ? await import(pathToFileURL(path.resolve('svelte.config.js')).href)
// : { default: {} };

/** @type {string[]} */
const svelte_extensions = /* config.extensions ?? - disabled because it would break .svx */ ['.svelte'];
const svelte_extensions = /* config.extensions ?? - disabled because it would break .svx */ [
'.svelte'
];
const extensions = [...svelte_extensions, '.ts', '.js'];
// TODO read tsconfig/jsconfig if available? src/** will be good for 99% of cases
const files = glob('src/**', { filesOnly: true, dot: true }).map((file) =>
file.replace(/\\/g, '/')
);
const files = glob(`{${folders.value.join(',')}}/**`, { filesOnly: true, dot: true })
.map((file) => file.replace(/\\/g, '/'))
gtm-nayan marked this conversation as resolved.
Show resolved Hide resolved
.filter((file) => !file.includes('/node_modules/'));

for (const file of files) {
if (extensions.some((ext) => file.endsWith(ext))) {
if (svelte_extensions.some((ext) => file.endsWith(ext))) {
update_svelte_file(file);
update_svelte_file(file, migrate_transition.value);
} else {
update_js_file(file);
}
@@ -55,7 +82,7 @@ export async function migrate() {

const tasks = [
use_git && cyan('git commit -m "migration to Svelte 4"'),
'Review the migration guide at TODO',
'Review the migration guide at https://svelte.dev/docs/v4-migration-guide',
'Read the updated docs at https://svelte.dev/docs'
].filter(Boolean);

Loading