default configuration for twind

This commit is contained in:
Seth Trowbridge 2023-04-29 11:15:54 -04:00
parent 8ab67be4d8
commit cdb9b35e68
4 changed files with 66 additions and 29 deletions

View File

@ -1,5 +1,3 @@
import TWPreTail from "https://esm.sh/v115/@twind/preset-tailwind@1.1.4/es2022/preset-tailwind.mjs";
import TWPreAuto from "https://esm.sh/v115/@twind/preset-autoprefix@1.0.7/es2022/preset-autoprefix.mjs";
import React from "react"; import React from "react";
import * as Iso from "@eno/iso"; import * as Iso from "@eno/iso";
@ -31,8 +29,3 @@ export default ()=>
</Iso.Switch> </Iso.Switch>
</div>; </div>;
}; };
export const CSS = {
presets: [TWPreTail(), TWPreAuto()],
hash:false
};

View File

@ -9,6 +9,6 @@
}, },
"tasks": { "tasks": {
"host": "deno run -A --unstable https://deno.land/std@0.181.0/http/file_server.ts", "host": "deno run -A --unstable https://deno.land/std@0.181.0/http/file_server.ts",
"dev": "deno run -A --unstable --reload=http://localhost:4507/ --no-lock --config=deno.json 'http://localhost:4507/server.tsx?reload=1'" "dev": "deno run -A --unstable --reload=http://localhost:4507/ --no-lock --config=deno.jsonc 'http://localhost:4507/server.tsx?reload=1'"
} }
} }

View File

@ -1,5 +1,13 @@
import TWPreTail from "https://esm.sh/v115/@twind/preset-tailwind@1.1.4/es2022/preset-tailwind.mjs";
import TWPreAuto from "https://esm.sh/v115/@twind/preset-autoprefix@1.0.7/es2022/preset-autoprefix.mjs";
import React from "react"; import React from "react";
export const CSS = {
presets: [TWPreTail(), TWPreAuto()],
hash:false
};
type Meta = {title:string, description:string, keywords:string, image:string, canonical:string } type Meta = {title:string, description:string, keywords:string, image:string, canonical:string }
type MetaKeys = keyof Meta; type MetaKeys = keyof Meta;
export const Meta:Meta = { export const Meta:Meta = {

View File

@ -1,6 +1,7 @@
import * as ESBuild from 'https://deno.land/x/esbuild@v0.14.45/mod.js'; import * as ESBuild from 'https://deno.land/x/esbuild@v0.14.45/mod.js';
import * as MIME from "https://deno.land/std@0.180.0/media_types/mod.ts"; import * as MIME from "https://deno.land/std@0.180.0/media_types/mod.ts";
import { debounce } from "https://deno.land/std@0.151.0/async/debounce.ts"; import { debounce } from "https://deno.land/std@0.151.0/async/debounce.ts";
import { parse as JSONC} from "https://deno.land/std@0.185.0/jsonc/mod.ts";
import SSR from "https://esm.sh/v113/preact-render-to-string@6.0.2"; import SSR from "https://esm.sh/v113/preact-render-to-string@6.0.2";
import Prepass from "https://esm.sh/preact-ssr-prepass@1.2.0"; import Prepass from "https://esm.sh/preact-ssr-prepass@1.2.0";
import * as Twind from "https://esm.sh/@twind/core@1.1.3"; import * as Twind from "https://esm.sh/@twind/core@1.1.3";
@ -60,11 +61,13 @@ const TranspileURL:Transpiler =async(inPath, inKey, inCheck)=>
const LibPath = "lib"; const LibPath = "lib";
type ImportMap = {imports?:Record<string, string>, importMap?:string}; type ImportMap = {imports?:Record<string, string>, importMap?:string};
let App, TwindInst;
let ImportObject:ImportMap = {}; let ImportObject:ImportMap = {};
try try
{ {
const confDeno = await fetch(`${Path.Active}/deno.json`); const confDeno = await fetch(`${Path.Active}/deno.jsonc`);
const confDenoParsed:ImportMap = await confDeno.json(); const confText = await confDeno.text();
const confDenoParsed = JSONC(confText) as ImportMap;
if(confDenoParsed.importMap) if(confDenoParsed.importMap)
{ {
try try
@ -102,16 +105,6 @@ try
console.log(`"imports" configuration does not alias "react"`); console.log(`"imports" configuration does not alias "react"`);
} }
const importApp = ImportObject.imports["@eno/app"];
if(importApp)
{
}
else
{
console.log(`"imports" configuration does not alias an entry-point component with "@eno/app"`);
}
const importIso = ImportObject.imports["@eno/iso"]; const importIso = ImportObject.imports["@eno/iso"];
if(importIso) if(importIso)
{ {
@ -121,6 +114,52 @@ try
{ {
} }
const importApp = ImportObject.imports["@eno/app"];
if(importApp)
{
let appImport
try
{
appImport = await import(Path.Active+importApp);
}
catch(e)
{
console.log(`"@eno/app" entry-point (${importApp}) file not found`)
}
if(typeof appImport.default == "function" )
{
App = appImport.default;
}
else
{
console.log(`"@eno/app" entry-point (${importApp}) needs to export a default function to use as the app root.`)
}
let twindConfig = Iso.CSS;
if(typeof appImport.CSS == "object")
{
twindConfig = {...twindConfig, ...appImport.CSS};
}
try
{
// @ts-ignore
TwindInst = Twind.install(twindConfig);
}
catch(e)
{
console.log(`CSS configuration is malformed`);
}
}
else
{
console.log(`"imports" configuration does not alias an entry-point file as "@eno/app"`);
}
Object.entries(ImportObject.imports).forEach(([key, value])=>{ Object.entries(ImportObject.imports).forEach(([key, value])=>{
if(value.startsWith("./") && ImportObject.imports) if(value.startsWith("./") && ImportObject.imports)
{ {
@ -135,7 +174,7 @@ try
} }
catch(e) catch(e)
{ {
console.log(`deno.json not found`); console.log(`error during configuration: ${e}`);
} }
@ -266,11 +305,11 @@ FileListen("${url.pathname}", reloadHandler);`;
<script type="module"> <script type="module">
import {hydrate, createElement as H} from "react"; import {hydrate, createElement as H} from "react";
import * as Twind from "https://esm.sh/v115/@twind/core@1.1.3/es2022/core.mjs"; import * as Twind from "https://esm.sh/v115/@twind/core@1.1.3/es2022/core.mjs";
import {default as App, CSS} from "@eno/app"; import * as App from "@eno/app";
import {Router, Fetch} from "@eno/iso"; import {Router, Fetch, CSS} from "@eno/iso";
Twind.install(CSS); Twind.install(App.CSS ? {...CSS, ...App.CSS} : CSS);
Fetch.Seed(${JSON.stringify(seed)}); Fetch.Seed(${JSON.stringify(seed)});
const hmrWrap = H( ()=>H(App) ); const hmrWrap = H( ()=>H(App.default) );
hydrate( H(Router.Provider, null, hmrWrap), document.querySelector("#app")); hydrate( H(Router.Provider, null, hmrWrap), document.querySelector("#app"));
</script> </script>
</body> </body>
@ -286,9 +325,6 @@ FileListen("${url.pathname}", reloadHandler);`;
} }
}); });
import App, {CSS} from "@eno/app";
const TwindInst = Twind.install(CSS);
const Sockets:Set<WebSocket> = new Set(); const Sockets:Set<WebSocket> = new Set();
const SocketsBroadcast =(inData:string)=>{ for (const socket of Sockets){ socket.send(inData); } } const SocketsBroadcast =(inData:string)=>{ for (const socket of Sockets){ socket.send(inData); } }