Skip to content

Commit ad5d85e

Browse files
ieedanieedan
authored
Merge pull request #308 from ieedan/language-support
2 parents de1250f + 1f0e54b commit ad5d85e

File tree

14 files changed

+280
-16
lines changed

14 files changed

+280
-16
lines changed

‎.changeset/chatty-taxis-chew.md‎

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,5 @@
1+
---
2+
"jsrepo": patch
3+
---
4+
5+
`*.(sass|scss)` support 🎉

‎.changeset/giant-pianos-sin.md‎

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,5 @@
1+
---
2+
"jsrepo": patch
3+
---
4+
5+
`*.html` support 🎉

‎examples/registry/blocks/angular/button/button.html‎

Lines changed: 15 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,15 @@
1+
<!DOCTYPE html>
2+
<html lang="en">
3+
<head>
4+
<meta charset="UTF-8">
5+
<meta name="viewport" content="width=device-width, initial-scale=1.0">
6+
<title>Button</title>
7+
<link rel="stylesheet" href="../../styles/test.scss">
8+
</head>
9+
<body>
10+
<button id="hey">
11+
Hey there
12+
</button>
13+
</body>
14+
<script src="../../scripts/test.js"></script>
15+
</html>

‎examples/registry/blocks/scripts/test.js‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1 @@
1+
console.log('hello')

‎examples/registry/blocks/styles/test.scss‎

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,3 @@
1+
* {
2+
box-sizing: border-box;
3+
}

‎examples/registry/jsrepo-manifest.json‎

Lines changed: 66 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -135,6 +135,32 @@
135135
}
136136
]
137137
},
138+
{
139+
"name": "angular",
140+
"blocks": [
141+
{
142+
"name": "button",
143+
"directory": "blocks/angular/button",
144+
"category": "angular",
145+
"tests": false,
146+
"subdirectory": true,
147+
"list": true,
148+
"files": [
149+
"button.html"
150+
],
151+
"localDependencies": [
152+
"styles/test",
153+
"scripts/test"
154+
],
155+
"dependencies": [],
156+
"devDependencies": [],
157+
"_imports_": {
158+
"../../styles/test.scss": "{{styles/test}}.scss",
159+
"../../scripts/test.js": "{{scripts/test}}.js"
160+
}
161+
}
162+
]
163+
},
138164
{
139165
"name": "logging",
140166
"blocks": [
@@ -154,5 +180,45 @@
154180
"devDependencies": []
155181
}
156182
]
183+
},
184+
{
185+
"name": "scripts",
186+
"blocks": [
187+
{
188+
"name": "test",
189+
"directory": "blocks/scripts",
190+
"category": "scripts",
191+
"tests": false,
192+
"subdirectory": false,
193+
"list": true,
194+
"files": [
195+
"test.js"
196+
],
197+
"localDependencies": [],
198+
"_imports_": {},
199+
"dependencies": [],
200+
"devDependencies": []
201+
}
202+
]
203+
},
204+
{
205+
"name": "styles",
206+
"blocks": [
207+
{
208+
"name": "test",
209+
"directory": "blocks/styles",
210+
"category": "styles",
211+
"tests": false,
212+
"subdirectory": false,
213+
"list": true,
214+
"files": [
215+
"test.scss"
216+
],
217+
"localDependencies": [],
218+
"_imports_": {},
219+
"dependencies": [],
220+
"devDependencies": []
221+
}
222+
]
157223
}
158224
]

‎packages/cli/package.json‎

Lines changed: 3 additions & 14 deletions
Original file line numberDiff line numberDiff line change
@@ -15,24 +15,12 @@
1515
"bugs": {
1616
"url": "https://github.com/ieedan/jsrepo/issues"
1717
},
18-
"keywords": [
19-
"repo",
20-
"cli",
21-
"svelte",
22-
"vue",
23-
"typescript",
24-
"javascript",
25-
"shadcn",
26-
"registry"
27-
],
18+
"keywords": ["repo", "cli", "svelte", "vue", "typescript", "javascript", "shadcn", "registry"],
2819
"type": "module",
2920
"exports": "./dist/index.js",
3021
"bin": "./dist/index.js",
3122
"main": "./dist/index.js",
32-
"files": [
33-
"./schemas/**/*",
34-
"dist"
35-
],
23+
"files": ["./schemas/**/*", "dist"],
3624
"scripts": {
3725
"start": "tsup --silent && node ./dist/index.js",
3826
"build": "tsup",
@@ -68,6 +56,7 @@
6856
"node-fetch": "^3.3.2",
6957
"octokit": "^4.0.2",
7058
"package-manager-detector": "^0.2.7",
59+
"parse5": "^7.2.1",
7160
"pathe": "^1.1.2",
7261
"prettier": "^3.4.2",
7362
"svelte": "^5.14.4",

‎packages/cli/src/utils/build/check.ts‎

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -172,6 +172,11 @@ const rules = {
172172
'astro',
173173
'solid-js',
174174
'@angular/core',
175+
'@angular/common',
176+
'@angular/forms',
177+
'@angular/platform-browser',
178+
'@angular/platform-browser-dynamic',
179+
'@angular/router',
175180
]);
176181

177182
const frameworkDeps = [...block.devDependencies, ...block.dependencies]

‎packages/cli/src/utils/language-support.ts‎

Lines changed: 101 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -6,6 +6,7 @@ import * as v from '@vue/compiler-sfc';
66
import color from 'chalk';
77
import { type Node, walk } from 'estree-walker';
88
import { type TsConfigResult, createPathsMatcher, getTsconfig } from 'get-tsconfig';
9+
import * as parse5 from 'parse5';
910
import path from 'pathe';
1011
import * as prettier from 'prettier';
1112
import * as sv from 'svelte/compiler';
@@ -77,6 +78,87 @@ const css: Lang = {
7778
},
7879
};
7980

81+
/** Language support for `*.html` files. */
82+
const html: Lang = {
83+
matches: (fileName) => fileName.endsWith('.html'),
84+
resolveDependencies: ({ filePath, isSubDir, excludeDeps, dirs, cwd }) => {
85+
const sourceCode = fs.readFileSync(filePath).toString();
86+
87+
const ast = parse5.parse(sourceCode);
88+
89+
const imports: string[] = [];
90+
91+
// @ts-ignore yeah I know
92+
const walk = (node, enter: (node) => void) => {
93+
if (!node) return;
94+
95+
enter(node);
96+
97+
if (node.childNodes && node.childNodes.length > 0) {
98+
for (const n of node.childNodes) {
99+
walk(n, enter);
100+
}
101+
}
102+
};
103+
104+
for (const node of ast.childNodes) {
105+
walk(node, (n) => {
106+
if (n.tagName === 'script') {
107+
for (const attr of n.attrs) {
108+
if (attr.name === 'src') {
109+
imports.push(attr.value);
110+
}
111+
}
112+
}
113+
114+
if (
115+
n.tagName === 'link' &&
116+
// @ts-ignore yeah I know
117+
n.attrs.find((attr) => attr.name === 'rel' && attr.value === 'stylesheet')
118+
) {
119+
for (const attr of n.attrs) {
120+
if (attr.name === 'href' && !attr.value.startsWith('http')) {
121+
imports.push(attr.value);
122+
}
123+
}
124+
}
125+
});
126+
}
127+
128+
const resolveResult = resolveImports({
129+
moduleSpecifiers: imports,
130+
filePath,
131+
isSubDir,
132+
dirs,
133+
cwd,
134+
doNotInstall: ['svelte', '@sveltejs/kit', ...excludeDeps],
135+
});
136+
137+
if (resolveResult.isErr()) {
138+
return Err(
139+
resolveResult
140+
.unwrapErr()
141+
.map((err) => formatError(err))
142+
.join('\n')
143+
);
144+
}
145+
146+
return Ok(resolveResult.unwrap());
147+
},
148+
comment: (content) => `<!--\n${lines.join(lines.get(content), { prefix: () => '\t' })}\n-->`,
149+
format: async (code, { formatter, prettierOptions }) => {
150+
if (!formatter) return code;
151+
152+
if (formatter === 'prettier') {
153+
return await prettier.format(code, { parser: 'html', ...prettierOptions });
154+
}
155+
156+
// biome is in progress for formatting html
157+
158+
return code;
159+
},
160+
};
161+
80162
/** Language support for `*.(json)` files. */
81163
const json: Lang = {
82164
matches: (fileName) => fileName.endsWith('.json'),
@@ -131,6 +213,23 @@ const jsonc: Lang = {
131213
},
132214
};
133215

216+
/** Language support for `*.(sass|scss)` files. */
217+
const sass: Lang = {
218+
matches: (fileName) => fileName.endsWith('.sass') || fileName.endsWith('.scss'),
219+
resolveDependencies: () =>
220+
Ok({ dependencies: [], local: [], devDependencies: [], imports: {} }),
221+
comment: (content) => `/*\n${lines.join(lines.get(content), { prefix: () => '\t' })}\n*/`,
222+
format: async (code, { formatter, prettierOptions }) => {
223+
if (!formatter) return code;
224+
225+
if (formatter === 'prettier') {
226+
return await prettier.format(code, { parser: 'scss', ...prettierOptions });
227+
}
228+
229+
return code;
230+
},
231+
};
232+
134233
/** Language support for `*.svelte` files. */
135234
const svelte: Lang = {
136235
matches: (fileName) => fileName.endsWith('.svelte'),
@@ -719,6 +818,6 @@ const resolveRemoteDeps = (
719818
};
720819
};
721820

722-
const languages: Lang[] = [css, json, jsonc, svelte, svg, typescript, vue, yaml];
821+
const languages: Lang[] = [css, html, json, jsonc, sass, svelte, svg, typescript, vue, yaml];
723822

724-
export { css, json, jsonc, svelte, svg, typescript, vue, yaml, languages };
823+
export { css, html, json, jsonc, sass, svelte, svg, typescript, vue, yaml, languages };

‎pnpm-lock.yaml‎

Lines changed: 10 additions & 0 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

0 commit comments

Comments
 (0)