-> v0.22.9

ensure CSS placeholders are overwritten

.gitignore

@@ -11,4 +11,5 @@ test/app/build
 sapper
 runtime.js
 dist
-!rollup.config.js
+!rollup.config.js
+templates/*.js

CHANGELOG.md

@@ -1,5 +1,42 @@
 # sapper changelog
 
+## 0.22.9
+
+* Fix legacy builds ([#462](https://github.com/sveltejs/sapper/pull/462))
+
+## 0.22.8
+
+* Ensure CSS placeholders are overwritten ([#462](https://github.com/sveltejs/sapper/pull/462))
+
+## 0.22.7
+
+* Fix cookies ([#460](https://github.com/sveltejs/sapper/pull/460))
+
+## 0.22.6
+
+* Normalise chunk filenames on Windows ([#456](https://github.com/sveltejs/sapper/pull/456))
+* Load modules with credentials ([#458](https://github.com/sveltejs/sapper/pull/458))
+
+## 0.22.5
+
+* Fix `sapper dev`. Oops.
+
+## 0.22.4
+
+* Ensure launcher does not overwrite a module ([#455](https://github.com/sveltejs/sapper/pull/455))
+
+## 0.22.3
+
+* Prevent server from accidentally importing dev client
+
+## 0.22.2
+
+* Make paths in generated code relative to project
+
+## 0.22.1
+
+* Fix `pkg.files`
+
 ## 0.22.0
 
 * Move generated files into `__sapper__` ([#453](https://github.com/sveltejs/sapper/pull/453))

package-lock.json

@@ -1,6 +1,6 @@
 {
   "name": "sapper",
-  "version": "0.21.1",
+  "version": "0.22.3",
   "lockfileVersion": 1,
   "requires": true,
   "dependencies": {

package.json

@@ -1,18 +1,17 @@
 {
   "name": "sapper",
-  "version": "0.22.0",
+  "version": "0.22.9",
   "description": "Military-grade apps, engineered by Svelte",
   "bin": {
     "sapper": "./sapper"
   },
   "files": [
     "*.js",
-    "runtime",
     "webpack",
     "config",
     "sapper",
-    "components",
-    "dist/*.js"
+    "dist/*.js",
+    "templates/*.js"
   ],
   "directories": {
     "test": "test"

rollup.config.js

@@ -16,7 +16,7 @@ function template(kind, external) {
 	return {
 		input: `templates/src/${kind}/index.ts`,
 		output: {
-			file: `templates/dist/${kind}.js`,
+			file: `templates/${kind}.js`,
 			format: 'es'
 		},
 		external,

src/api/dev.ts

@@ -256,7 +256,7 @@ class Watcher extends EventEmitter {
 						execArgv.push(`--inspect-port=${this.devtools_port}`);
 					}
 
-					this.proc = child_process.fork(`${dest}/server.js`, [], {
+					this.proc = child_process.fork(`${dest}/server/server.js`, [], {
 						cwd: process.cwd(),
 						env: Object.assign({
 							PORT: this.port

src/api/export.ts

@@ -71,7 +71,7 @@ async function execute(emitter: EventEmitter, opts: Opts) {
 		message: `Crawling ${root.href}`
 	});
 
-	const proc = child_process.fork(path.resolve(`${opts.build}/server.js`), [], {
+	const proc = child_process.fork(path.resolve(`${opts.build}/server/server.js`), [], {
 		cwd: process.cwd(),
 		env: Object.assign({
 			PORT: port,

src/cli.ts

@@ -58,7 +58,7 @@ prog.command('build [dest]')
 				process.env.PORT = process.env.PORT || ${opts.port || 3000};
 
 				console.log('Starting server on port ' + process.env.PORT);
-				require('./server.js');
+				require('./server/server.js');
 			`.replace(/^\t+/gm, '').trim());
 
 			console.error(`\n> Finished in ${elapsed(start)}. Type ${colors.bold.cyan(`node ${dest}`)} to run the app.`);

src/core/create_compilers/RollupResult.ts

@@ -38,11 +38,18 @@ export default class RollupResult implements CompileResult {
 		// webpack, but we can have a route -> [chunk] map or something
 		this.assets = {};
 
-		compiler.chunks.forEach(chunk => {
-			if (compiler.input in chunk.modules) {
-				this.assets.main = chunk.fileName;
+		if (typeof compiler.input === 'string') {
+			compiler.chunks.forEach(chunk => {
+				if (compiler.input in chunk.modules) {
+					this.assets.main = chunk.fileName;
+				}
+			});
+		} else {
+			for (const name in compiler.input) {
+				const file = compiler.input[name];
+				this.assets[name] = compiler.chunks.find(chunk => file in chunk.modules).fileName;
 			}
-		});
+		}
 
 		this.summary = compiler.chunks.map(chunk => {
 			const size_color = chunk.code.length > 150000 ? colors.bold.red : chunk.code.length > 50000 ? colors.bold.yellow : colors.bold.white;

src/core/create_compilers/extract_css.ts

@@ -170,9 +170,8 @@ export default function extract_css(client_result: CompileResult, components: Pa
 		return null;
 	}
 
-	let main = client_result.assets.main;
-	if (process.env.SAPPER_LEGACY_BUILD) main = `legacy/${main}`;
-	const entry = fs.readFileSync(`${dirs.dest}/client/${main}`, 'utf-8');
+	let asset_dir = `${dirs.dest}/client`;
+	if (process.env.SAPPER_LEGACY_BUILD) asset_dir += '/legacy';
 
 	const replacements = new Map();
 
@@ -186,10 +185,10 @@ export default function extract_css(client_result: CompileResult, components: Pa
 				const output_file_name = chunk.file.replace(/\.js$/, '.css');
 
 				map.file = output_file_name;
-				map.sources = map.sources.map(source => path.relative(`${dirs.dest}/client`, source));
+				map.sources = map.sources.map(source => path.relative(`${asset_dir}`, source));
 
-				fs.writeFileSync(`${dirs.dest}/client/${output_file_name}`, `${code}\n/* sourceMappingURL=client/${output_file_name}.map */`);
-				fs.writeFileSync(`${dirs.dest}/client/${output_file_name}.map`, JSON.stringify(map, null, '  '));
+				fs.writeFileSync(`${asset_dir}/${output_file_name}`, `${code}\n/* sourceMappingURL=./${output_file_name}.map */`);
+				fs.writeFileSync(`${asset_dir}/${output_file_name}.map`, JSON.stringify(map, null, '  '));
 
 				return true;
 			}
@@ -205,11 +204,17 @@ export default function extract_css(client_result: CompileResult, components: Pa
 		result.chunks[component.file] = files;
 	});
 
-	const replaced = entry.replace(/["']__SAPPER_CSS_PLACEHOLDER:(.+?)__["']/g, (m, route) => {
-		return JSON.stringify(replacements.get(route));
-	});
+	fs.readdirSync(asset_dir).forEach(file => {
+		if (fs.statSync(`${asset_dir}/${file}`).isDirectory()) return;
 
-	fs.writeFileSync(`${dirs.dest}/client/${main}`, replaced);
+		const source = fs.readFileSync(`${asset_dir}/${file}`, 'utf-8');
+
+		const replaced = source.replace(/["']__SAPPER_CSS_PLACEHOLDER:(.+?)__["']/g, (m, route) => {
+			return JSON.stringify(replacements.get(route));
+		});
+
+		fs.writeFileSync(`${asset_dir}/${file}`, replaced);
+	});
 
 	const leftover = get_css_from_modules(Array.from(unaccounted_for));
 	if (leftover) {
@@ -220,10 +225,10 @@ export default function extract_css(client_result: CompileResult, components: Pa
 		const output_file_name = `main.${main_hash}.css`;
 
 		map.file = output_file_name;
-		map.sources = map.sources.map(source => path.relative(`${dirs.dest}/client`, source));
+		map.sources = map.sources.map(source => path.relative(asset_dir, source));
 
-		fs.writeFileSync(`${dirs.dest}/client/${output_file_name}`, `${code}\n/* sourceMappingURL=client/${output_file_name}.map */`);
-		fs.writeFileSync(`${dirs.dest}/client/${output_file_name}.map`, JSON.stringify(map, null, '  '));
+		fs.writeFileSync(`${asset_dir}/${output_file_name}`, `${code}\n/* sourceMappingURL=client/${output_file_name}.map */`);
+		fs.writeFileSync(`${asset_dir}/${output_file_name}.map`, JSON.stringify(map, null, '  '));
 
 		result.main = output_file_name;
 	}

src/core/create_compilers/index.ts

@@ -15,6 +15,13 @@ export default async function create_compilers(bundler: 'rollup' | 'webpack'): P
 		const config = await RollupCompiler.load_config();
 		validate_config(config, 'rollup');
 
+		normalize_rollup_config(config.client);
+		normalize_rollup_config(config.server);
+
+		if (config.serviceworker) {
+			normalize_rollup_config(config.serviceworker);
+		}
+
 		return {
 			client: new RollupCompiler(config.client),
 			server: new RollupCompiler(config.server),
@@ -41,4 +48,14 @@ function validate_config(config: any, bundler: 'rollup' | 'webpack') {
 	if (!config.client || !config.server) {
 		throw new Error(`${bundler}.config.js must export a { client, server, serviceworker? } object`);
 	}
-}
+}
+
+function normalize_rollup_config(config: any) {
+	if (typeof config.input === 'string') {
+		config.input = path.normalize(config.input);
+	} else {
+		for (const name in config.input) {
+			config.input[name] = path.normalize(config.input[name]);
+		}
+	}
+}

src/core/create_manifests.ts

@@ -64,7 +64,7 @@ function generate_client(
 	bundler: string,
 	dev_port?: number
 ) {
-	const template_file = path.resolve(__dirname, '../templates/dist/client.js');
+	const template_file = path.resolve(__dirname, '../templates/client.js');
 	const template = fs.readFileSync(template_file, 'utf-8');
 
 	const page_ids = new Set(manifest_data.pages.map(page =>
@@ -127,9 +127,11 @@ function generate_client(
 
 		footer = `
 
-			import(${stringify(sapper_dev_client)}).then(client => {
-				client.connect(${dev_port});
-			});`.replace(/^\t{3}/gm, '');
+			if (typeof window !== 'undefined') {
+				import(${stringify(sapper_dev_client)}).then(client => {
+					client.connect(${dev_port});
+				});
+			}`.replace(/^\t{3}/gm, '');
 	}
 
 	return `// This file is generated by Sapper — do not edit it!\n` + template
@@ -145,7 +147,7 @@ function generate_server(
 	manifest_data: ManifestData,
 	path_to_routes: string
 ) {
-	const template_file = path.resolve(__dirname, '../templates/dist/server.js');
+	const template_file = path.resolve(__dirname, '../templates/server.js');
 	const template = fs.readFileSync(template_file, 'utf-8');
 
 	const imports = [].concat(
@@ -204,9 +206,12 @@ function generate_server(
 			error
 		};`.replace(/^\t\t/gm, '').trim();
 
+	const build_dir = path.relative(process.cwd(), locations.dest());
+	const src_dir = path.relative(process.cwd(), locations.src());
+
 	return `// This file is generated by Sapper — do not edit it!\n` + template
-		.replace('__BUILD__DIR__', JSON.stringify(locations.dest()))
-		.replace('__SRC__DIR__', JSON.stringify(locations.src()))
+		.replace('__BUILD__DIR__', JSON.stringify(build_dir))
+		.replace('__SRC__DIR__', JSON.stringify(src_dir))
 		.replace('__DEV__', dev() ? 'true' : 'false')
 		.replace(/const manifest = __MANIFEST__;/, code);
 }

src/rollup.ts

@@ -24,12 +24,14 @@ export default {
 
 	server: {
 		input: () => {
-			return `${locations.src()}/server.js`
+			return {
+				server: `${locations.src()}/server.js`
+			};
 		},
 
 		output: () => {
 			return {
-				dir: locations.dest(),
+				dir: `${locations.dest()}/server`,
 				format: 'cjs',
 				sourcemap: dev()
 			};

src/webpack.ts

@@ -29,7 +29,7 @@ export default {
 
 		output: () => {
 			return {
-				path: locations.dest(),
+				path: `${locations.dest()}/server`,
 				filename: '[name].js',
 				chunkFilename: '[hash]/[name].[id].js',
 				libraryTarget: 'commonjs2'

templates/src/server/middleware/get_page_handler.ts

@@ -93,19 +93,21 @@ export function get_page_handler(
 					if (include_cookies) {
 						if (!opts.headers) opts.headers = {};
 
-						const str = []
-							.concat(
-								cookie.parse(req.headers.cookie || ''),
-								cookie.parse(opts.headers.cookie || ''),
-								cookie.parse(res.getHeader('Set-Cookie') || '')
-							)
-							.map(cookie => {
-								return Object.keys(cookie)
-									.map(name => `${name}=${encodeURIComponent(cookie[name])}`)
-									.join('; ');
-							})
-							.filter(Boolean)
-							.join(', ');
+						const cookies = Object.assign(
+							{},
+							cookie.parse(req.headers.cookie || ''),
+							cookie.parse(opts.headers.cookie || '')
+						);
+
+						const set_cookie = res.getHeader('Set-Cookie');
+						(Array.isArray(set_cookie) ? set_cookie : [set_cookie]).forEach(str => {
+							const match = /([^=]+)=([^;]+)/.exec(<string>str);
+							if (match) cookies[match[1]] = match[2];
+						});
+
+						const str = Object.keys(cookies)
+							.map(key => `${key}=${cookies[key]}`)
+							.join('; ');
 
 						opts.headers.cookie = str;
 					}
@@ -222,9 +224,9 @@ export function get_page_handler(
 			if (build_info.bundler === 'rollup') {
 				if (build_info.legacy_assets) {
 					const legacy_main = `${req.baseUrl}/client/legacy/${build_info.legacy_assets.main}`;
-					script += `(function(){try{eval("async function x(){}");var main="${main}"}catch(e){main="${legacy_main}"};try{new Function("import('"+main+"')")();}catch(e){var s=document.createElement("script");s.src="${req.baseUrl}/client/shimport@${build_info.shimport}.js";s.setAttribute("data-main",main);document.head.appendChild(s);}}());`;
+					script += `(function(){try{eval("async function x(){}");var main="${main}"}catch(e){main="${legacy_main}"};var s=document.createElement("script");try{new Function("if(0)import('')")();s.src=main;s.type="module";s.crossOrigin="use-credentials";}catch(e){s.src="${req.baseUrl}/client/shimport@${build_info.shimport}.js";s.setAttribute("data-main",main);}document.head.appendChild(s);}());`;
 				} else {
-					script += `try{new Function("import('${main}')")();}catch(e){var s=document.createElement("script");s.src="${req.baseUrl}/client/shimport@${build_info.shimport}.js";s.setAttribute("data-main","${main}");document.head.appendChild(s);}`;
+					script += `var s=document.createElement("script");try{new Function("if(0)import('')")();s.src="${main}";s.type="module";s.crossOrigin="use-credentials";}catch(e){console.error(e);s.src="${req.baseUrl}/client/shimport@${build_info.shimport}.js";s.setAttribute("data-main","${main}")}document.head.appendChild(s)`;
 				}
 			} else {
 				script += `</script><script src="${main}">`;

test/app/src/routes/credentials/test.json.js

@@ -1,20 +1,15 @@
-export function get(req, res) {
-	const cookies = req.headers.cookie
-		? req.headers.cookie.split(/,\s+/).reduce((cookies, cookie) => {
-			const [pair] = cookie.split('; ');
-			const [name, value] = pair.split('=');
-			cookies[name] = value;
-			return cookies;
-		}, {})
-		: {};
+import cookie from 'cookie';
+
+export function get(req, res) {
+	if (req.headers.cookie) {
+		const cookies = cookie.parse(req.headers.cookie);
 
-	if (cookies.test) {
 		res.writeHead(200, {
 			'Content-Type': 'application/json'
 		});
 
 		res.end(JSON.stringify({
-			message: cookies.test
+			message: `a: ${cookies.a}, b: ${cookies.b}, max-age: ${cookies['max-age']}`
 		}));
 	} else {
 		res.writeHead(403, {

test/app/src/server.js

@@ -44,7 +44,7 @@ const middlewares = [
 
 	// set test cookie
 	(req, res, next) => {
-		res.setHeader('Set-Cookie', 'test=woohoo!; Max-Age=3600');
+		res.setHeader('Set-Cookie', ['a=1; Path=/', 'b=2; Path=/']);
 		next();
 	},
 

test/common/test.js

@@ -184,7 +184,7 @@ function run({ mode, basepath = '' }) {
 					assert.ok(fs.existsSync('__sapper__/build/index.js'));
 				}
 
-				proc = require('child_process').fork(`${dir}/server.js`, {
+				proc = require('child_process').fork(`${dir}/server/server.js`, {
 					cwd: process.cwd(),
 					env: {
 						NODE_ENV: mode,
@@ -623,7 +623,7 @@ function run({ mode, basepath = '' }) {
 				return nightmare.goto(`${base}/credentials?creds=include`)
 					.page.title()
 					.then(title => {
-						assert.equal(title, 'woohoo!');
+						assert.equal(title, 'a: 1, b: 2, max-age: undefined');
 					});
 			});
 
@@ -641,7 +641,7 @@ function run({ mode, basepath = '' }) {
 					.wait(100)
 					.page.title()
 					.then(title => {
-						assert.equal(title, 'woohoo!');
+						assert.equal(title, 'a: 1, b: 2, max-age: undefined');
 					});
 			});