8000 chore: use `parse` & `print` from `svelte/compiler` by manuel3108 · Pull Request #568 · sveltejs/cli · GitHub
[go: up one dir, main page]
Skip to content

chore: use parse & print from svelte/compiler #568

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.

Sign up for GitHub

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

Draft
wants to merge 4 commits into
base: main
Choose a base branch
from
Draft

chore: use parse & print from svelte/compiler #568

Show file tree
Hide file tree
Changes from 1 commit
Commits
Show all changes
4 commits
Select commit Hold shift + click to select a range
8000
3c6c63a
utils
manuel3108 May 18, 2025
4f84d68
make paraglide work
manuel3108 May 18, 2025
ede290f
Merge remote-tracking branch 'origin/main' into chore/svelte-compiler
manuel3108 Jun 21, 2025
e676656
use print (local svelte & esrap setup required)
manuel3108 Jun 21, 2025
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
Prev Previous commit
Next Next commit
make paraglide work
  • Loading branch information
@manuel3108
manuel3108 committed May 18, 2025
commit 4f84d6821b92e8b6c6050b3d5d7dca89a8bb4f8d
29 changes: 21 additions & 8 deletions packages/addons/common.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,4 +1,5 @@
import { imports, exports, common } from '@sveltejs/cli-core/js';
import { toSvelteFragment, type SvelteAst } from '@sveltejs/cli-core/html';
import { parseScript, parseSvelte } from '@sveltejs/cli-core/parsers';
import process from 'node:process';

Expand Down Expand Up @@ -64,17 +65,29 @@ export function addEslintConfigPrettier(content: string): string {
}

export function addToDemoPage(content: string, path: string): string {
const { template, generateCode } = parseSvelte(content);

for (const node of template.ast.childNodes) {
if (node.type === 'tag' && node.attribs['href'] === `/demo/${path}`) {
return content;
const { ast, generateCode } = parseSvelte(content);

for (const node of ast.fragment.nodes) {
if (node.type === 'RegularElement') {
const hrefAttribute = node.attributes.find(
(x) => x.type === 'Attribute' && x.name === 'href'
) as SvelteAst.Attribute;
if (!hrefAttribute || !hrefAttribute.value) continue;

if (!Array.isArray(hrefAttribute.value)) continue;

const hasDemo = hrefAttribute.value.find(
(x) => x.type === 'Text' && x.data === `/demo/${path}`
);
if (hasDemo) {
return content;
}
}
}

const newLine = template.source ? '\n' : '';
const src = template.source + `${newLine}<a href="/demo/${path}">${path}</a>`;
return generateCode({ template: src });
ast.fragment.nodes.push(...toSvelteFragment(`<a href="/demo/${path}">${path}</a>`));

return generateCode();
}

/**
Expand Down
49 changes: 27 additions & 22 deletions packages/addons/paraglide/index.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,4 +1,3 @@
import MagicString from 'magic-string';
import { colors, defineAddon, defineAddonOptions, log } from '@sveltejs/cli-core';
import {
array,
Expand Down Expand Up @@ -187,38 +186,44 @@ export default defineAddon({

// add usage example
sv.file(`${kit.routesDirectory}/demo/paraglide/+page.svelte`, (content) => {
const { script, template, generateCode } = parseSvelte(content, { typescript });
console.log(content);
const { ast, generateCode } = parseSvelte(content);

let scriptAst = ast.instance?.content;
if (!scriptAst) {
scriptAst = parseScript('').ast;
ast.instance = {
type: 'Script',
start: 0,
end: 0,
context: 'default',
attributes: [],
content: scriptAst
};
}

imports.addNamed(script.ast, '$lib/paraglide/messages.js', { m: 'm' });
imports.addNamed(script.ast, '$app/navigation', { goto: 'goto' });
imports.addNamed(script.ast, '$app/state', { page: 'page' });
imports.addNamed(script.ast, '$lib/paraglide/runtime', {
imports.addNamed(scriptAst, '$lib/paraglide/messages.js', { m: 'm' });
imports.addNamed(scriptAst, '$lib/paraglide/runtime', {
setLocale: 'setLocale'
});

const scriptCode = new MagicString(script.generateCode());

const templateCode = new MagicString(template.source);

// add localized message
templateCode.append("\n\n<h1>{m.hello_world({ name: 'SvelteKit User' })}</h1>\n");
let templateCode = "<h1>{m.hello_world({ name: 'SvelteKit User' })}</h1>";

// add links to other localized pages, the first one is the default
// language, thus it does not require any localized route
const { validLanguageTags } = parseLanguageTagInput(options.languageTags);
const links = validLanguageTags
.map(
(x) =>
`${templateCode.getIndentString()}<button onclick={() => setLocale('${x}')}>${x}</button>`
)
.join('\n');
templateCode.append(`<div>\n${links}\n</div>`);

templateCode.append(
'<p>\nIf you use VSCode, install the <a href="https://marketplace.visualstudio.com/items?itemName=inlang.vs-code-extension" target="_blank">Sherlock i18n extension</a> for a better i18n experience.\n</p>'
);
.map((x) => `<button onclick={() => setLocale('${x}')}>${x}</button>`)
.join('');
templateCode += `<div>${links}</div>`;

return generateCode({ script: scriptCode.toString(), template: templateCode.toString() });
templateCode +=
'<p>If you use VSCode, install the <a href="https://marketplace.visualstudio.com/items?itemName=inlang.vs-code-extension" target="_blank">Sherlock i18n extension</a> for a better i18n experience.</p>';

ast.fragment.nodes.push(...html.toSvelteFragment(templateCode));

return generateCode();
});
}

Expand Down
Loading
0