mirror of
https://github.com/kevin-DL/sapper.git
synced 2026-01-17 21:24:59 +00:00
work in progress
This commit is contained in:
6
test/app/app/client.js
Normal file
6
test/app/app/client.js
Normal file
@@ -0,0 +1,6 @@
|
||||
import { init } from '../../../runtime.js';
|
||||
import { routes } from './manifest/client.js';
|
||||
|
||||
window.init = () => {
|
||||
return init(document.querySelector('#sapper'), routes);
|
||||
};
|
||||
12
test/app/app/manifest/client.js
Normal file
12
test/app/app/manifest/client.js
Normal file
@@ -0,0 +1,12 @@
|
||||
// This file is generated by Sapper — do not edit it!
|
||||
export const routes = [
|
||||
{ pattern: /^\/?$/, params: () => ({}), load: () => import(/* webpackChunkName: "_" */ '../../routes/index.html') },
|
||||
{ pattern: /^\/4xx\/?$/, params: () => ({}), load: () => import(/* webpackChunkName: "_4xx" */ '../../routes/4xx.html') },
|
||||
{ pattern: /^\/about\/?$/, params: () => ({}), load: () => import(/* webpackChunkName: "about" */ '../../routes/about.html') },
|
||||
{ pattern: /^\/show-url\/?$/, params: () => ({}), load: () => import(/* webpackChunkName: "show_url" */ '../../routes/show-url.html') },
|
||||
{ pattern: /^\/slow-preload\/?$/, params: () => ({}), load: () => import(/* webpackChunkName: "slow_preload" */ '../../routes/slow-preload.html') },
|
||||
{ pattern: /^\/delete-test\/?$/, params: () => ({}), load: () => import(/* webpackChunkName: "delete_test" */ '../../routes/delete-test.html') },
|
||||
{ pattern: /^\/5xx\/?$/, params: () => ({}), load: () => import(/* webpackChunkName: "_5xx" */ '../../routes/5xx.html') },
|
||||
{ pattern: /^\/blog\/?$/, params: () => ({}), load: () => import(/* webpackChunkName: "blog" */ '../../routes/blog/index.html') },
|
||||
{ pattern: /^\/blog(?:\/([^\/]+))?\/?$/, params: match => ({ slug: match[1] }), load: () => import(/* webpackChunkName: "blog_$slug$" */ '../../routes/blog/[slug].html') }
|
||||
];
|
||||
28
test/app/app/manifest/server.js
Normal file
28
test/app/app/manifest/server.js
Normal file
@@ -0,0 +1,28 @@
|
||||
// This file is generated by Sapper — do not edit it!
|
||||
import _ from '../../routes/index.html';
|
||||
import _4xx from '../../routes/4xx.html';
|
||||
import about from '../../routes/about.html';
|
||||
import show_url from '../../routes/show-url.html';
|
||||
import slow_preload from '../../routes/slow-preload.html';
|
||||
import delete_test from '../../routes/delete-test.html';
|
||||
import _5xx from '../../routes/5xx.html';
|
||||
import blog from '../../routes/blog/index.html';
|
||||
import * as api_blog_contents from '../../routes/api/blog/contents.js';
|
||||
import * as api_delete_$id$ from '../../routes/api/delete/[id].js';
|
||||
import * as api_blog_$slug$ from '../../routes/api/blog/[slug].js';
|
||||
import blog_$slug$ from '../../routes/blog/[slug].html';
|
||||
|
||||
export const routes = [
|
||||
{ id: '_', type: 'page', pattern: /^\/?$/, params: () => ({}), module: _ },
|
||||
{ id: '_4xx', type: 'page', pattern: /^\/4xx\/?$/, params: () => ({}), module: _4xx },
|
||||
{ id: 'about', type: 'page', pattern: /^\/about\/?$/, params: () => ({}), module: about },
|
||||
{ id: 'show_url', type: 'page', pattern: /^\/show-url\/?$/, params: () => ({}), module: show_url },
|
||||
{ id: 'slow_preload', type: 'page', pattern: /^\/slow-preload\/?$/, params: () => ({}), module: slow_preload },
|
||||
{ id: 'delete_test', type: 'page', pattern: /^\/delete-test\/?$/, params: () => ({}), module: delete_test },
|
||||
{ id: '_5xx', type: 'page', pattern: /^\/5xx\/?$/, params: () => ({}), module: _5xx },
|
||||
{ id: 'blog', type: 'page', pattern: /^\/blog\/?$/, params: () => ({}), module: blog },
|
||||
{ id: 'api_blog_contents', type: 'route', pattern: /^\/api\/blog\/contents\/?$/, params: () => ({}), module: api_blog_contents },
|
||||
{ id: 'api_delete_$id$', type: 'route', pattern: /^\/api\/delete(?:\/([^\/]+))?\/?$/, params: match => ({ id: match[1] }), module: api_delete_$id$ },
|
||||
{ id: 'api_blog_$slug$', type: 'route', pattern: /^\/api\/blog(?:\/([^\/]+))?\/?$/, params: match => ({ slug: match[1] }), module: api_blog_$slug$ },
|
||||
{ id: 'blog_$slug$', type: 'page', pattern: /^\/blog(?:\/([^\/]+))?\/?$/, params: match => ({ slug: match[1] }), module: blog_$slug$ }
|
||||
];
|
||||
37
test/app/app/manifest/service-worker.js
Normal file
37
test/app/app/manifest/service-worker.js
Normal file
@@ -0,0 +1,37 @@
|
||||
|
||||
export const timestamp = 1518800295364;
|
||||
|
||||
export const assets = [
|
||||
"favicon.png",
|
||||
"global.css",
|
||||
"great-success.png",
|
||||
"manifest.json",
|
||||
"svelte-logo-192.png",
|
||||
"svelte-logo-512.png"
|
||||
];
|
||||
|
||||
export const shell = [
|
||||
"/client/_.0.3a37f8afa58c59f4bdf9.js",
|
||||
"/client/blog.1.3a37f8afa58c59f4bdf9.js",
|
||||
"/client/blog_$slug$.2.3a37f8afa58c59f4bdf9.js",
|
||||
"/client/about.3.3a37f8afa58c59f4bdf9.js",
|
||||
"/client/_5xx.4.3a37f8afa58c59f4bdf9.js",
|
||||
"/client/_4xx.5.3a37f8afa58c59f4bdf9.js",
|
||||
"/client/slow_preload.6.3a37f8afa58c59f4bdf9.js",
|
||||
"/client/show_url.7.3a37f8afa58c59f4bdf9.js",
|
||||
"/client/delete_test.8.3a37f8afa58c59f4bdf9.js",
|
||||
"/client/main.3a37f8afa58c59f4bdf9.js"
|
||||
];
|
||||
|
||||
export const routes = [
|
||||
{ pattern: /^\/?$/ },
|
||||
{ pattern: /^\/4xx\/?$/ },
|
||||
{ pattern: /^\/about\/?$/ },
|
||||
{ pattern: /^\/show-url\/?$/ },
|
||||
{ pattern: /^\/slow-preload\/?$/ },
|
||||
{ pattern: /^\/delete-test\/?$/ },
|
||||
{ pattern: /^\/5xx\/?$/ },
|
||||
{ pattern: /^\/blog\/?$/ },
|
||||
{ pattern: /^\/blog(?:\/([^\/]+))?\/?$/ }
|
||||
];
|
||||
|
||||
78
test/app/app/server.js
Normal file
78
test/app/app/server.js
Normal file
@@ -0,0 +1,78 @@
|
||||
import fs from 'fs';
|
||||
import express from 'express';
|
||||
import compression from 'compression';
|
||||
import serve from 'serve-static';
|
||||
import sapper from '../../../middleware';
|
||||
import { routes } from './manifest/server.js';
|
||||
|
||||
let count;
|
||||
let ended;
|
||||
|
||||
process.on('message', message => {
|
||||
if (message.action === 'start') {
|
||||
count = 0;
|
||||
ended = false;
|
||||
process.send({ type: 'ready' });
|
||||
}
|
||||
|
||||
if (message.action === 'end') {
|
||||
ended = true;
|
||||
if (count === 0) process.send({ type: 'done' });
|
||||
}
|
||||
});
|
||||
|
||||
const app = express();
|
||||
|
||||
app.use((req, res, next) => {
|
||||
count += 1;
|
||||
|
||||
const { write, end } = res;
|
||||
const chunks = [];
|
||||
|
||||
res.write = function(chunk) {
|
||||
chunks.push(new Buffer(chunk));
|
||||
write.apply(res, arguments);
|
||||
};
|
||||
|
||||
res.end = function(chunk) {
|
||||
if (chunk) chunks.push(new Buffer(chunk));
|
||||
end.apply(res, arguments);
|
||||
|
||||
count -= 1;
|
||||
|
||||
process.send({
|
||||
method: req.method,
|
||||
url: req.url,
|
||||
status: res.statusCode,
|
||||
headers: res._headers,
|
||||
body: Buffer.concat(chunks).toString()
|
||||
});
|
||||
|
||||
if (count === 0 && ended) {
|
||||
process.send({ type: 'done' });
|
||||
}
|
||||
};
|
||||
|
||||
next();
|
||||
});
|
||||
|
||||
const { PORT = 3000 } = process.env;
|
||||
|
||||
// this allows us to do e.g. `fetch('/api/blog')` on the server
|
||||
const fetch = require('node-fetch');
|
||||
global.fetch = (url, opts) => {
|
||||
if (url[0] === '/') url = `http://localhost:${PORT}${url}`;
|
||||
return fetch(url, opts);
|
||||
};
|
||||
|
||||
app.use(compression({ threshold: 0 }));
|
||||
|
||||
app.use(serve('assets'));
|
||||
|
||||
app.use(sapper({
|
||||
routes
|
||||
}));
|
||||
|
||||
app.listen(PORT, () => {
|
||||
console.log(`listening on port ${PORT}`);
|
||||
});
|
||||
@@ -1,14 +1,12 @@
|
||||
const ASSETS = `cache__timestamp__`;
|
||||
import { assets, shell, timestamp, routes } from './manifest/service-worker.js';
|
||||
|
||||
const ASSETS = `cachetimestamp`;
|
||||
|
||||
// `shell` is an array of all the files generated by webpack,
|
||||
// `assets` is an array of everything in the `assets` directory
|
||||
const to_cache = __shell__.concat(__assets__);
|
||||
const to_cache = shell.concat(assets);
|
||||
const cached = new Set(to_cache);
|
||||
|
||||
// `routes` is an array of `{ pattern: RegExp }` objects that
|
||||
// match the pages in your app
|
||||
const routes = __routes__;
|
||||
|
||||
self.addEventListener('install', event => {
|
||||
event.waitUntil(
|
||||
caches
|
||||
18
test/app/routes/4xx.html
Normal file
18
test/app/routes/4xx.html
Normal file
@@ -0,0 +1,18 @@
|
||||
<:Head>
|
||||
<title>{{status}}</title>
|
||||
</:Head>
|
||||
|
||||
<Layout page='home'>
|
||||
<h1>{{status}}</h1>
|
||||
<p>{{message}}</p>
|
||||
</Layout>
|
||||
|
||||
<script>
|
||||
import Layout from './_components/Layout.html';
|
||||
|
||||
export default {
|
||||
components: {
|
||||
Layout
|
||||
}
|
||||
};
|
||||
</script>
|
||||
18
test/app/routes/5xx.html
Normal file
18
test/app/routes/5xx.html
Normal file
@@ -0,0 +1,18 @@
|
||||
<:Head>
|
||||
<title>{{status}}</title>
|
||||
</:Head>
|
||||
|
||||
<Layout page='home'>
|
||||
<h1>{{status}}</h1>
|
||||
<p>{{error.message}}</p>
|
||||
</Layout>
|
||||
|
||||
<script>
|
||||
import Layout from './_components/Layout.html';
|
||||
|
||||
export default {
|
||||
components: {
|
||||
Layout
|
||||
}
|
||||
};
|
||||
</script>
|
||||
@@ -1,24 +0,0 @@
|
||||
const fs = require('fs');
|
||||
const app = require('express')();
|
||||
const compression = require('compression');
|
||||
const sapper = require('sapper');
|
||||
const static = require('serve-static');
|
||||
|
||||
const { PORT = 3000 } = process.env;
|
||||
|
||||
// this allows us to do e.g. `fetch('/api/blog')` on the server
|
||||
const fetch = require('node-fetch');
|
||||
global.fetch = (url, opts) => {
|
||||
if (url[0] === '/') url = `http://localhost:${PORT}${url}`;
|
||||
return fetch(url, opts);
|
||||
};
|
||||
|
||||
app.use(compression({ threshold: 0 }));
|
||||
|
||||
app.use(static('assets'));
|
||||
|
||||
app.use(sapper());
|
||||
|
||||
app.listen(PORT, () => {
|
||||
console.log(`listening on port ${PORT}`);
|
||||
});
|
||||
@@ -1,44 +0,0 @@
|
||||
<!doctype>
|
||||
<html lang='en'>
|
||||
<head>
|
||||
<meta charset='utf-8'>
|
||||
<meta name='viewport' content='width=device-width'>
|
||||
<meta name='theme-color' content='#aa1e1e'>
|
||||
|
||||
<link rel='manifest' href='/manifest.json'>
|
||||
<link rel='icon' type='image/png' href='/favicon.png'>
|
||||
|
||||
<!-- %sapper.status% is the HTTP status code, e.g. 404 -->
|
||||
<title>%sapper.status%</title>
|
||||
|
||||
<style>
|
||||
body {
|
||||
max-width: 800px;
|
||||
padding: 1em;
|
||||
margin: 0 auto;
|
||||
font-family: Roboto, -apple-system, BlinkMacSystemFont, Segoe UI, Oxygen, Ubuntu, Cantarell, Fira Sans, Droid Sans, Helvetica Neue, sans-serif;
|
||||
background-color: #f4f4f4;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
h1 {
|
||||
color: rgb(170,30,30);
|
||||
border-bottom: 1px solid #aaa;
|
||||
padding: 0 0 0.5em 0;
|
||||
margin: 1em 0;
|
||||
}
|
||||
|
||||
pre {
|
||||
font-family: Menlo, monospace;
|
||||
font-size: 14px;
|
||||
line-height: 1.2;
|
||||
overflow-x: auto;
|
||||
white-space: pre-wrap;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<h1>%sapper.title%</h1>
|
||||
<p>Could not %sapper.method% %sapper.url%</p>
|
||||
</body>
|
||||
</html>
|
||||
@@ -1,47 +0,0 @@
|
||||
<!doctype>
|
||||
<html lang='en'>
|
||||
<head>
|
||||
<meta charset='utf-8'>
|
||||
<meta name='viewport' content='width=device-width'>
|
||||
<meta name='theme-color' content='#aa1e1e'>
|
||||
|
||||
<link rel='manifest' href='/manifest.json'>
|
||||
<link rel='icon' type='image/png' href='/favicon.png'>
|
||||
|
||||
<title>%sapper.status%</title>
|
||||
|
||||
<style>
|
||||
body {
|
||||
max-width: 800px;
|
||||
padding: 1em;
|
||||
margin: 0 auto;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
h1 {
|
||||
color: rgb(170,30,30);
|
||||
border-bottom: 1px solid #aaa;
|
||||
padding: 0 0 0.5em 0;
|
||||
margin: 1em 0;
|
||||
}
|
||||
|
||||
pre {
|
||||
font-family: Menlo, monospace;
|
||||
font-size: 14px;
|
||||
line-height: 1.2;
|
||||
overflow-x: auto;
|
||||
white-space: pre-wrap;
|
||||
}
|
||||
|
||||
.stack {
|
||||
font-size: 12px;
|
||||
color: #999;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<h1>%sapper.title%</h1>
|
||||
<pre>%sapper.error%</pre>
|
||||
<pre class='stack'>%sapper.stack%</pre>
|
||||
</body>
|
||||
</html>
|
||||
@@ -1,5 +0,0 @@
|
||||
import { init } from '../../../runtime.js';
|
||||
|
||||
window.init = () => {
|
||||
return init(document.querySelector('#sapper'), __routes__);
|
||||
};
|
||||
@@ -1,8 +1,8 @@
|
||||
const config = require('../../webpack/config.js');
|
||||
const config = require('../../../webpack/config.js');
|
||||
const webpack = require('webpack');
|
||||
|
||||
module.exports = {
|
||||
entry: config.client.entry(),
|
||||
entry: './app/client.js',
|
||||
output: config.client.output(),
|
||||
resolve: {
|
||||
extensions: ['.js', '.html']
|
||||
|
||||
@@ -1,12 +1,17 @@
|
||||
const config = require('../../webpack/config.js');
|
||||
const config = require('../../../webpack/config.js');
|
||||
const pkg = require('../package.json');
|
||||
const sapper_pkg = require('../../../package.json');
|
||||
|
||||
module.exports = {
|
||||
entry: config.server.entry(),
|
||||
entry: {
|
||||
'server': './app/server.js'
|
||||
},
|
||||
output: config.server.output(),
|
||||
target: 'node',
|
||||
resolve: {
|
||||
extensions: ['.js', '.html']
|
||||
},
|
||||
externals: Object.keys(pkg.dependencies).concat(Object.keys(sapper_pkg.dependencies)),
|
||||
module: {
|
||||
rules: [
|
||||
{
|
||||
|
||||
17
test/app/webpack/service-worker.config.js
Normal file
17
test/app/webpack/service-worker.config.js
Normal file
@@ -0,0 +1,17 @@
|
||||
const path = require('path');
|
||||
const config = require('../../../webpack/config.js');
|
||||
const webpack = require('webpack');
|
||||
|
||||
module.exports = {
|
||||
entry: {
|
||||
'service-worker': './app/service-worker.js'
|
||||
},
|
||||
output: {
|
||||
path: path.resolve(`.sapper`),
|
||||
filename: '[name].js',
|
||||
chunkFilename: '[name].[id].[hash].js'
|
||||
},
|
||||
plugins: [
|
||||
!config.dev && new webpack.optimize.ModuleConcatenationPlugin()
|
||||
].filter(Boolean)
|
||||
};
|
||||
Reference in New Issue
Block a user