mirror of
https://github.com/kevin-DL/sapper.git
synced 2026-01-15 20:34:44 +00:00
start generating client-side bundle. WIP
This commit is contained in:
27
utils/create_app.js
Normal file
27
utils/create_app.js
Normal 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);
|
||||
};
|
||||
@@ -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
|
||||
}
|
||||
});
|
||||
}
|
||||
81
utils/create_webpack_compiler.js
Normal file
81
utils/create_webpack_compiler.js
Normal 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;
|
||||
};
|
||||
Reference in New Issue
Block a user