start generating client-side bundle. WIP

This commit is contained in:
Rich Harris
2017-12-11 13:08:25 -05:00
parent ad8a410ba4
commit a22e28a11f
9 changed files with 4990 additions and 39 deletions

27
utils/create_app.js Normal file
View File

@@ -0,0 +1,27 @@
const fs = require('fs');
const path = require('path');
const tmp = require('tmp');
const template = fs.readFileSync(path.resolve(__dirname, '../templates/main.js'), 'utf-8');
module.exports = function create_app(routes, dest, matchers, dev) {
// TODO in dev mode, watch files
const code = matchers
.map(matcher => {
const condition = matcher.dynamic.length === 0 ?
`url.pathname === '/${matcher.parts.join('/')}'` :
`${matcher.pattern}.test(url.pathname)`;
return `
if (${condition}) {
import('../routes/${matcher.file}').then(render);
}
`.replace(/^\t{3}/gm, '').trim();
})
.join(' else ');
const main = template.replace('// ROUTES', code);
fs.writeFileSync(path.join(dest, 'main.js'), main);
};

View File

@@ -30,6 +30,7 @@ module.exports = function create_matchers(files) {
return {
file,
pattern,
test,
exec,
parts,
@@ -41,12 +42,5 @@ module.exports = function create_matchers(files) {
(a.dynamic.length - b.dynamic.length) || // match static paths first
(b.parts.length - a.parts.length) // match longer paths first
);
})
.map(matcher => {
return {
file: matcher.file,
test: matcher.test,
exec: matcher.exec
}
});
}

View File

@@ -0,0 +1,81 @@
const fs = require('fs');
const webpack = require('webpack');
const ExtractTextPlugin = require("extract-text-webpack-plugin");
const UglifyJSPlugin = require('uglifyjs-webpack-plugin');
// TODO make the webpack config, err, configurable
module.exports = function create_webpack_compiler(main, dest, dev) {
const compiler = {};
const _ = webpack({
entry: {
main
},
resolve: {
extensions: ['.js', '.html']
},
output: {
path: dest,
filename: '[name].[hash].js',
chunkFilename: '[name].[id].js',
publicPath: '/webpack/'
},
module: {
rules: [
{
test: /\.html$/,
exclude: /node_modules/,
use: {
loader: 'svelte-loader',
options: {
emitCss: true,
cascade: false,
store: true
}
}
},
{
test: /\.css$/,
use: ExtractTextPlugin.extract({
fallback: 'style-loader',
use: [{ loader: 'css-loader', options: { sourceMap: dev } }]
})
}
]
},
plugins: [
new ExtractTextPlugin('main.css'),
!dev && new webpack.optimize.ModuleConcatenationPlugin(),
!dev && new UglifyJSPlugin()
].filter(Boolean),
devtool: dev ? 'inline-source-map' : false
});
if (false) { // TODO watch in dev
// TODO how can we invalidate compiler.app when watcher restarts?
compiler.app = new Promise((fulfil, reject) => {
_.watch({}, (err, stats) => {
if (err || stats.hasErrors()) {
// TODO handle errors
}
const filename = stats.toJson().assetsByChunkName.main;
fulfil(`/webpack/${filename}`);
});
});
} else {
compiler.app = new Promise((fulfil, reject) => {
_.run((err, stats) => {
if (err || stats.hasErrors()) {
// TODO handle errors
}
const filename = stats.toJson().assetsByChunkName.main;
fulfil(`/webpack/${filename}`);
});
});
}
return compiler;
};