mirror of
https://github.com/kevin-DL/sapper.git
synced 2026-01-18 21:45:12 +00:00
print warnings in dev mode for unused data
This commit is contained in:
@@ -224,11 +224,8 @@ class Watcher extends EventEmitter {
|
|||||||
});
|
});
|
||||||
|
|
||||||
this.proc.on('message', message => {
|
this.proc.on('message', message => {
|
||||||
if (message.__sapper__ && message.event === 'basepath') {
|
if (!message.__sapper__) return;
|
||||||
this.emit('basepath', {
|
this.emit(message.event, message);
|
||||||
basepath: message.basepath
|
|
||||||
});
|
|
||||||
}
|
|
||||||
});
|
});
|
||||||
|
|
||||||
this.proc.on('exit', emitFatal);
|
this.proc.on('exit', emitFatal);
|
||||||
|
|||||||
@@ -2,6 +2,7 @@ import * as path from 'path';
|
|||||||
import * as colors from 'ansi-colors';
|
import * as colors from 'ansi-colors';
|
||||||
import * as child_process from 'child_process';
|
import * as child_process from 'child_process';
|
||||||
import prettyMs from 'pretty-ms';
|
import prettyMs from 'pretty-ms';
|
||||||
|
import pb from 'pretty-bytes';
|
||||||
import { dev as _dev } from '../api/dev';
|
import { dev as _dev } from '../api/dev';
|
||||||
import * as events from '../api/interfaces';
|
import * as events from '../api/interfaces';
|
||||||
|
|
||||||
@@ -44,6 +45,32 @@ export function dev(opts: { port: number, open: boolean }) {
|
|||||||
if (event.log) console.log(event.log);
|
if (event.log) console.log(event.log);
|
||||||
});
|
});
|
||||||
|
|
||||||
|
watcher.on('preload', (event) => {
|
||||||
|
if (event.size > 25000) {
|
||||||
|
console.log(colors.bold.yellow(`${event.url} — large amount of preloaded data`));
|
||||||
|
console.log(`${colors.bold(pb(event.size))} of data was preloaded in total, above the recommended limit of ${pb(25000)}`);
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
watcher.on('unused_data', (event) => {
|
||||||
|
console.log(colors.bold.yellow(`${event.url} — unused preloaded data`));
|
||||||
|
console.log(`More data was returned from \`preload\` than was used during the initial render. Consider only returning essential data.`);
|
||||||
|
|
||||||
|
event.discrepancies.forEach(discrepancy => {
|
||||||
|
console.log(`${colors.bold(discrepancy.file)} loaded ${colors.bold(pb(discrepancy.preloaded))}, of which ${discrepancy.rendered > 2 ? `only ${colors.bold(pb(discrepancy.rendered))}` : 'none'} was used. The following properties were not referenced:`);
|
||||||
|
|
||||||
|
const slice = discrepancy.props.length > 12
|
||||||
|
? discrepancy.props.slice(0, 10)
|
||||||
|
: discrepancy.props;
|
||||||
|
|
||||||
|
console.log(slice.map((prop: string) => `• ${prop}`).join('\n'));
|
||||||
|
|
||||||
|
if (discrepancy.props.length > slice.length) {
|
||||||
|
console.log(`...and ${discrepancy.props.length - slice.length} more`);
|
||||||
|
}
|
||||||
|
});
|
||||||
|
});
|
||||||
|
|
||||||
watcher.on('build', (event: events.BuildEvent) => {
|
watcher.on('build', (event: events.BuildEvent) => {
|
||||||
if (event.errors.length) {
|
if (event.errors.length) {
|
||||||
console.log(`${colors.bold.red(`✗ ${event.type}`)}`);
|
console.log(`${colors.bold.red(`✗ ${event.type}`)}`);
|
||||||
|
|||||||
Reference in New Issue
Block a user