reesericci/actionview-svelte-handler
reesericci/actionview-svelte-handler
Fork 0
Code Issues 5 Pull requests Releases 10 Activity Actions

add standard-typescript
Some checks failed
Police / lint_and_check_types (push) Has been cancelled
Details

Browse source
This commit is contained in:
Reese Armstrong 2024-08-04 23:37:53 -04:00
commit 15a7bd43fe
Signed by: reesericci
GPG key ID: 86A9594B08970A4B
9 changed files with 760 additions and 238 deletions
Download patch file Download diff file Expand all files Collapse all files

10
build.esbuild.js
View file

@ -4,19 +4,19 @@ const buildOpts = {
entryPoints: ['lib/ts/**/*.ts'],
bundle: false,
outdir: 'lib/svelte/js',
format: "esm",
format: 'esm',
write: true,
platform: "node",
platform: 'node',
banner: {
js: `/*
js: `/*
IF YOU ARE READING THIS, YOU ARE VIEWING THE BUILT JS FROM THE SOURCE TYPESCRIPT AT ../ts/ .
DO NOT MODIFY.
*/
`,
`
}
}
await esbuild.build(buildOpts)
export default buildOpts
export default buildOpts

4
lib/svelte/js/builder.js
View file

@ -41,7 +41,7 @@ class Builder {
format: "esm",
metafile: true,
plugins: [
// @ts-ignore
// @ts-expect-error
sveltePlugin({
compilerOptions: {
generate,
@ -51,7 +51,7 @@ class Builder {
},
preprocess: sveltePreprocess(this.preprocess),
filterWarnings: (warning) => {
if (warning.code == "missing-declaration" && warning.message.includes("'props'")) {
if (warning.code === "missing-declaration" && warning.message.includes("'props'")) {
return false;
}
return true;

10
lib/svelte/js/types/builder.d.js
View file

@ -1,10 +0,0 @@
/*
IF YOU ARE READING THIS, YOU ARE VIEWING THE BUILT JS FROM THE SOURCE TYPESCRIPT AT ../ts/ .
DO NOT MODIFY.
*/
var builder_d_default = Builder;
export {
builder_d_default as default
};

136
lib/ts/builder.ts
View file

@ -1,23 +1,23 @@
import { readable, Stores } from "svelte/store";
import { importFromStringSync } from "module-from-string";
import * as esbuild from "esbuild";
import sveltePlugin from "esbuild-svelte";
import { sveltePreprocess } from "svelte-preprocess";
import type { Warning } from "svelte/types/compiler/interfaces";
import { readable, Stores } from 'svelte/store'
import { importFromStringSync } from 'module-from-string'
import * as esbuild from 'esbuild'
import sveltePlugin from 'esbuild-svelte'
import { sveltePreprocess } from 'svelte-preprocess'
import type { Warning } from 'svelte/types/compiler/interfaces'
export type BuildSuccess = {
client: string;
server: {
html: string,
css: string
} | null;
compiled: {
client: string;
server: string | undefined;
};
};
export interface BuildSuccess {
client: string
server: {
html: string
css: string
} | null
compiled: {
client: string
server: string | undefined
}
}
export type BuildError = {
export interface BuildError {
error: any
}
@ -31,14 +31,15 @@ class Builder {
props: Stores
locals: object
compiled: {
client: string | null,
client: string | null
server: string | null
}
ssr: boolean
workingDir: string
preprocess: object
constructor(
constructor (
path: string,
props: object,
locals: object,
@ -46,102 +47,101 @@ class Builder {
server: string | null,
ssr: boolean,
workingDir: string,
preprocess: object,
preprocess: object
) {
this.path = path;
this.props = readable(props);
this.locals = locals;
this.path = path
this.props = readable(props)
this.locals = locals
this.compiled = {
client,
server,
};
this.ssr = ssr;
this.workingDir = workingDir;
this.preprocess = preprocess;
server
}
this.ssr = ssr
this.workingDir = workingDir
this.preprocess = preprocess
}
async bundle(generate: "ssr" | "dom", sveltePath = "svelte"): Promise<string> {
async bundle (generate: 'ssr' | 'dom', sveltePath = 'svelte'): Promise<string> {
const bundle = await esbuild.build({
entryPoints: [this.path],
mainFields: ["svelte", "browser", "module", "main"],
conditions: ["svelte", "browser"],
mainFields: ['svelte', 'browser', 'module', 'main'],
conditions: ['svelte', 'browser'],
absWorkingDir: this.workingDir,
write: false,
outfile: "component.js",
outfile: 'component.js',
bundle: true,
format: "esm",
format: 'esm',
metafile: true,
plugins: [
// @ts-ignore
// @ts-expect-error
sveltePlugin({
compilerOptions: {
generate,
css: "injected",
css: 'injected',
hydratable: true,
sveltePath,
sveltePath
},
preprocess: sveltePreprocess(this.preprocess),
filterWarnings: (warning: Warning) => {
if (
warning.code == "missing-declaration" &&
warning.code === 'missing-declaration' &&
warning.message.includes("'props'")
) {
return false;
return false
}
return true;
},
}),
],
});
return true
}
})
]
})
// @ts-ignore
const throwables = [].concat(bundle.errors, bundle.warnings);
// @ts-expect-error
const throwables = [].concat(bundle.errors, bundle.warnings)
if (throwables.length > 0) {
throw throwables[0];
throw throwables[0] // eslint-disable-line @typescript-eslint/no-throw-literal
}
return bundle.outputFiles[0].text;
return bundle.outputFiles[0].text
}
async client(): Promise<string> {
async client (): Promise<string> {
return (
this.compiled?.client ||
(await this.bundle("dom", "https://esm.sh/svelte"))
);
this.compiled?.client || (await this.bundle('dom', 'https://esm.sh/svelte')) // eslint-disable-line
)
}
async server(): Promise<{ output: string, html: string, css: string }> {
const output = this.compiled?.server || (await this.bundle("ssr"));
async server (): Promise<{ output: string, html: string, css: string }> {
const output = this.compiled?.server || (await this.bundle('ssr')) // eslint-disable-line
const Component = importFromStringSync(output, {
globals: { props: this.props },
}).default;
globals: { props: this.props }
}).default
const { html, css } = await Component.render(this.locals);
const { html, css } = await Component.render(this.locals)
return { output, html, css: css.code };
return { output, html, css: css.code }
}
async build(): Promise<BuildResult> {
async build (): Promise<BuildResult> {
try {
const serv = this.ssr ? await this.server() : null;
const cli = await this.client();
const serv = this.ssr ? await this.server() : null
const cli = await this.client()
const comp = {
client: cli,
server: serv?.output,
};
server: serv?.output
}
return {
client: cli,
server: serv,
compiled: comp,
};
compiled: comp
}
} catch (e) {
return { error: e };
return { error: e }
}
}
}
export default Builder;
export default Builder

12
lib/ts/types/builder.d.ts vendored
View file

@ -1,5 +1,5 @@
import { Stores } from "svelte/store";
export type BuildSuccess = {
import { Stores } from 'svelte/store';
export interface BuildSuccess {
client: string;
server: {
html: string;
@ -9,10 +9,10 @@ export type BuildSuccess = {
client: string;
server: string | undefined;
};
};
export type BuildError = {
}
export interface BuildError {
error: any;
};
}
export type BuildResult = BuildSuccess | BuildError;
/**
* Builder is a class that builds, compiles and bundles Svelte components into a nice object for the template handler
@ -29,7 +29,7 @@ declare class Builder {
workingDir: string;
preprocess: object;
constructor(path: string, props: object, locals: object, client: string | null, server: string | null, ssr: boolean, workingDir: string, preprocess: object);
bundle(generate: "ssr" | "dom", sveltePath?: string): Promise<string>;
bundle(generate: 'ssr' | 'dom', sveltePath?: string): Promise<string>;
client(): Promise<string>;
server(): Promise<{
output: string;

801
package-lock.json generated
View file

File diff suppressed because it is too large Load diff

16
package.json
View file

@ -2,7 +2,17 @@
"name": "actionview-svelte-handler",
"type": "module",
"private": true,
"types": "lib/ts/types",
"types": "lib/ts/types/builder.d.ts",
"typescript": {
"definition": "lib/ts/types/builder.d.ts"
},
"ts-standard": {
"project": "./tsconfig.json",
"ignore": [
"./lib/ts/types/",
"types/"
]
},
"dependencies": {
"esbuild-svelte": "^0.8.1",
"module-from-string": "^3.3.1",
@ -14,13 +24,13 @@
"node": ">=12.16.0"
},
"scripts": {
"lint": "standard . --fix",
"lint": "ts-standard lib/ts/ --fix",
"build": "node build.esbuild.js",
"postbuild": "tsc",
"watch": "node watch.esbuild.js"
},
"devDependencies": {
"esbuild": "0.23.0",
"standard": "^17.1.0"
"ts-standard": "^12.0.2"
}
}

3
tsconfig.json
View file

@ -2,7 +2,8 @@
"compilerOptions": {
"target": "es2022",
"module": "nodenext",
"rootDir": "./lib/ts",
"rootDir": "./lib/ts/",
"checkJs": false,
"declaration": true,
"declarationDir": "lib/ts/types",
"emitDeclarationOnly": true,

6
watch.esbuild.js
View file

@ -1,4 +1,4 @@
import buildOpts from "./build.esbuild.js"
import esbuild from "esbuild"
import buildOpts from './build.esbuild.js'
import esbuild from 'esbuild'
await (await esbuild.context(buildOpts)).watch()
await (await esbuild.context(buildOpts)).watch()