nebel/_
1
0
Fork 0
mirror of https://github.com/kou029w/_.git synced 2025-01-30 22:08:02 +00:00
Code Issues Projects Releases Wiki Activity

create wmr

Browse source
This commit is contained in:
Nebel 2021-04-20 19:11:14 +09:00
parent 4a4a56578c
commit 014d0d133f
13 changed files with 229 additions and 0 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

4
wmr/.gitignore vendored Normal file
View file

@ -0,0 +1,4 @@
.cache
node_modules
dist
stats.html

21
wmr/package.json Normal file
View file

@ -0,0 +1,21 @@
{
"scripts": {
"start": "wmr",
"build": "wmr build --prerender",
"serve": "wmr serve"
},
"eslintConfig": {
"extends": "preact"
},
"alias": {
"react": "preact/compat",
"react-dom": "preact/compat"
},
"dependencies": {
"preact": "^10.5.12",
"preact-iso": "^1.0.0"
},
"devDependencies": {
"wmr": "^1.2.0"
}
}

22
wmr/public/header.js Normal file
View file

@ -0,0 +1,22 @@
import { useLocation } from "preact-iso/router";
export default function Header() {
const { url } = useLocation();
return (
<header>
<nav>
<a href="/">Home</a>
<a href="/about">About</a>
<a href="/error">Error</a>
</nav>
<label>
URL:
<input
readonly
value={url}
ref={(c) => c && (c.size = c.value.length)}
/>
</label>
</header>
);
}

15
wmr/public/index.html Normal file
View file

@ -0,0 +1,15 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<title>WMR App</title>
<meta name="description" content="WMR App" />
<meta name="viewport" content="width=device-width,initial-scale=1" />
<link rel="icon" href="data:" />
<link rel="preload" as="script" href="/index.js" crossorigin />
<link rel="stylesheet" href="/style.css" />
</head>
<body>
<script type="module" src="/index.js"></script>
</body>
</html>

32
wmr/public/index.js Normal file
View file

@ -0,0 +1,32 @@
import hydrate from "preact-iso/hydrate";
import { LocationProvider, Router } from "preact-iso/router";
import lazy, { ErrorBoundary } from "preact-iso/lazy";
import Home from "./pages/home/index.js";
import NotFound from "./pages/_404.js";
import Header from "./header.js";
const About = lazy(() => import("./pages/about/index.js"));
export function App() {
return (
<LocationProvider>
<div class="app">
<Header />
<ErrorBoundary>
<Router>
<Home path="/" />
<About path="/about" />
<NotFound default />
</Router>
</ErrorBoundary>
</div>
</LocationProvider>
);
}
hydrate(<App />);
export async function prerender(data) {
const { default: prerender } = await import("preact-iso/prerender");
return await prerender(<App {...data} />);
}

8
wmr/public/pages/_404.js Normal file
View file

@ -0,0 +1,8 @@
const NotFound = () => (
<section>
<h1>404: Not Found</h1>
<p>It's gone :(</p>
</section>
);
export default NotFound;

11
wmr/public/pages/about/index.js Normal file
View file

@ -0,0 +1,11 @@
import styles from "./style.module.css";
const About = ({ query }) => (
<section class={styles.about}>
<h1>About</h1>
<p>A page all about this website.</p>
<pre>{JSON.stringify(query)}</pre>
</section>
);
export default About;

3
wmr/public/pages/about/style.module.css Normal file
View file

@ -0,0 +1,3 @@
.about {
background: #dbcfe7;
}

24
wmr/public/pages/home/index.js Normal file
View file

@ -0,0 +1,24 @@
import styles from "./style.module.css";
import { useState } from "preact/hooks";
export default function Home() {
const [count, setCount] = useState(0);
return (
<>
<section class={styles.home}>
<h1>Home</h1>
<p>This is the home page.</p>
<>
<button style={{ width: 30 }} onClick={() => setCount(count - 1)}>
-
</button>
<output style={{ padding: 10 }}>Count: {count}</output>
<button style={{ width: 30 }} onClick={() => setCount(count + 1)}>
+
</button>
</>
</section>
</>
);
}

4
wmr/public/pages/home/style.module.css Normal file
View file

@ -0,0 +1,4 @@
.home {
background: #f6f6f6;
color: #333;
}

45
wmr/public/style.css Normal file
View file

@ -0,0 +1,45 @@
html,
body {
margin: 0;
min-height: 100%;
font-family: system-ui, sans-serif;
}
header {
display: flex;
background: #ddd;
}
header > nav {
flex: 1;
display: flex;
}
header > nav a {
padding: 10px;
color: #673ab8;
text-decoration: none;
}
header > nav a:hover {
background-color: #f1e9ff;
}
header > label {
display: flex;
align-items: center;
padding: 10px;
color: #555;
font-size: 80%;
}
header input {
border: none;
border-radius: 3px;
padding: 2px 5px;
font-size: 100%;
}
.app > section {
padding: 20px;
}

17
wmr/tsconfig.json Normal file
View file

@ -0,0 +1,17 @@
{
"compilerOptions": {
"jsx": "preserve",
"jsxFactory": "preact.h",
"jsxFragmentFactory": "preact.Fragment",
"allowJs": true,
"checkJs": true,
"strict": true,
"noEmit": true,
"moduleResolution": "node",
"target": "esnext",
"module": "esnext",
"resolveJsonModule": true,
"allowSyntheticDefaultImports": true,
"downlevelIteration": true
}
}

23
wmr/yarn.lock Normal file
View file

@ -0,0 +1,23 @@
# THIS IS AN AUTOGENERATED FILE. DO NOT EDIT THIS FILE DIRECTLY.
# yarn lockfile v1
fsevents@^2.1.3:
version "2.3.2"
resolved "https://registry.yarnpkg.com/fsevents/-/fsevents-2.3.2.tgz#8a526f78b8fdf4623b709e0b975c52c24c02fd1a"
integrity sha512-xiqMQR4xAeHTuB9uWm+fFRcIOgKBMiOBP+eXiyT7jsgVCq1bkVygt00oASowB7EdtpOHaaPgKt812P9ab+DDKA==
preact-iso@^1.0.0:
version "1.1.1"
resolved "https://registry.yarnpkg.com/preact-iso/-/preact-iso-1.1.1.tgz#959656bfee479e6a8c6707753e84d4342f61c48b"
integrity sha512-/iG9YH2nlLf3DAEXxCxka6Mux32t2cZEgfbvkNnR9ZtK0yjDRBEHI1IJS6I1AtelAFuBvoD24Ua0sc7wdZb1vg==
preact@^10.5.12:
version "10.5.13"
resolved "https://registry.yarnpkg.com/preact/-/preact-10.5.13.tgz#85f6c9197ecd736ce8e3bec044d08fd1330fa019"
integrity sha512-q/vlKIGNwzTLu+jCcvywgGrt+H/1P/oIRSD6mV4ln3hmlC+Aa34C7yfPI4+5bzW8pONyVXYS7SvXosy2dKKtWQ==
wmr@^1.2.0:
version "1.5.1"
resolved "https://registry.yarnpkg.com/wmr/-/wmr-1.5.1.tgz#f7630da86ff69eef935c7b8361230482d06bc880"
integrity sha512-CW+cMxaTFsCgBmcQXeuvTJ0rM5+IhOOA0f8xAZdfre63TNlEoOw0T3G8bKYRV7N+SaveF3siRFis96rSVnyMuQ==