totole/sapper
1
0
Fork 0
mirror of https://github.com/kevin-DL/sapper.git synced 2026-01-19 13:55:21 +00:00
Code Issues Packages Projects Releases Wiki Activity

run webpack in watch mode during dev

Browse Source
This commit is contained in:
Rich Harris
2017-12-16 16:50:46 -05:00
parent 71ed3864b7
commit 5995b7ae6a
6 changed files with 54 additions and 31 deletions
Download Patch File Download Diff File Expand all files Collapse all files

7
connect.js
View File

@@ -69,14 +69,13 @@ module.exports = function connect(opts) {
req.params = route.exec(url); req.params = route.exec(url);
const chunk = compiler.chunks[route.id]; const mod = require(compiler.server_routes)[route.id];
const mod = require(path.resolve(dest, 'server', chunk));
if (route.type === 'page') { if (route.type === 'page') {
let data = { params: req.params, query: req.query }; let data = { params: req.params, query: req.query };
if (mod.default.preload) data = Object.assign(data, await mod.default.preload(data)); if (mod.preload) data = Object.assign(data, await mod.preload(data));
const { html, head, css } = mod.default.render(data); const { html, head, css } = mod.render(data);
const page = templates.render(200, { const page = templates.render(200, {
main: compiler.client_main, main: compiler.client_main,

2
lib/config.js
View File

@@ -12,3 +12,5 @@ exports.dest = path.resolve(
); );
exports.main_built = path.resolve('templates/.main.tmp.js'); exports.main_built = path.resolve('templates/.main.tmp.js');
exports.server_routes = path.resolve(exports.dest, 'server-routes.js');

59
lib/utils/create_app.js
View File

@@ -1,30 +1,51 @@
const fs = require('fs'); const fs = require('fs');
const path = require('path'); const path = require('path');
const { main_built } = require('../config.js'); const { dest, main_built, server_routes } = require('../config.js');
const template = fs.readFileSync('templates/main.js', 'utf-8');
module.exports = function create_app(src, dest, routes, options) { module.exports = function create_app(src, dest, routes, options) {
// TODO in dev mode, watch files function create_client_main() {
const template = fs.readFileSync('templates/main.js', 'utf-8');
const code = `[${ const code = `[${
routes routes
.filter(route => route.type === 'page') .filter(route => route.type === 'page')
.map(route => {
const params = route.dynamic.length === 0 ?
'{}' :
`{ ${route.dynamic.map((part, i) => `${part}: match[${i + 1}]`).join(', ') } }`;
return `{ pattern: ${route.pattern}, params: match => (${params}), load: () => import(/* webpackChunkName: "${route.id}" */ '${src}/${route.file}') }`
})
.join(', ')
}]`;
const main = template.replace('__routes__', code);
fs.writeFileSync(main_built, main);
// need to fudge the mtime, because webpack is soft in the head
const stats = fs.statSync(main_built);
fs.utimesSync(main_built, stats.atimeMs - 9999, stats.mtimeMs - 9999);
}
function create_server_routes() {
const imports = routes
.map(route => { .map(route => {
const params = route.dynamic.length === 0 ? return route.type === 'page' ?
'{}' : `import ${route.id} from '${src}/${route.file}';` :
`{ ${route.dynamic.map((part, i) => `${part}: match[${i + 1}]`).join(', ') } }`; `import * as ${route.id} from '${src}/${route.file}';`;
return `{ pattern: ${route.pattern}, params: match => (${params}), load: () => import(/* webpackChunkName: "${route.id}" */ '${src}/${route.file}') }`
}) })
.join(', ') .join('\n');
}]`;
const main = template.replace('__routes__', code); const exports = `export { ${routes.map(route => route.id)} };`;
fs.writeFileSync(main_built, main); fs.writeFileSync(server_routes, `${imports}\n\n${exports}`);
// need to fudge the mtime, because webpack is soft in the head const stats = fs.statSync(server_routes);
const stats = fs.statSync(main_built); fs.utimesSync(server_routes, stats.atimeMs - 9999, stats.mtimeMs - 9999);
fs.utimesSync(main_built, stats.atimeMs - 9999, stats.mtimeMs - 9999); }
// TODO in dev mode, watch files
create_client_main();
create_server_routes();
}; };

1
lib/utils/create_compiler.js
View File

@@ -44,6 +44,7 @@ module.exports = function create_webpack_compiler(dest, routes, dev) {
reject(err || info.errors[0]); reject(err || info.errors[0]);
} }
compiler.server_routes = path.resolve(dest, 'server', info.assetsByChunkName.server_routes);
compiler.chunks = info.assetsByChunkName; compiler.chunks = info.assetsByChunkName;
} }

4
lib/utils/create_routes.js
View File

@@ -8,7 +8,9 @@ module.exports = function create_matchers(files) {
const parts = file.replace(/\.(html|js|mjs)$/, '').split(path.sep); const parts = file.replace(/\.(html|js|mjs)$/, '').split(path.sep);
if (parts[parts.length - 1] === 'index') parts.pop(); if (parts[parts.length - 1] === 'index') parts.pop();
const id = parts.join('_').replace(/[[\]]/g, '$') || '_'; const id = (
parts.join('_').replace(/[[\]]/g, '$').replace(/^\d/, '_$&').replace(/[^a-zA-Z0-9_$]/g, '_')
) || '_';
const dynamic = parts const dynamic = parts
.filter(part => part[0] === '[') .filter(part => part[0] === '[')

10
webpack/config.js
View File

@@ -1,6 +1,6 @@
const path = require('path'); const path = require('path');
const route_manager = require('../lib/route_manager.js'); const route_manager = require('../lib/route_manager.js');
const { src, dest, dev, main_built } = require('../lib/config.js'); const { src, dest, dev, main_built, server_routes } = require('../lib/config.js');
module.exports = { module.exports = {
dev, dev,
@@ -24,11 +24,9 @@ module.exports = {
server: { server: {
entry: () => { entry: () => {
const entries = {}; return {
route_manager.routes.forEach(route => { server_routes
entries[route.id] = path.resolve(src, route.file); }
});
return entries;
}, },
output: () => { output: () => {