External javascript files (with svelte-preprocess) for the _error component #1374
Description
Describe the bug
It seems specific to the _error.svelte file (that is near _layout)
My goal is to use "external javascript" files for svelte component,
it works for most of the files (including _layout, routes and other components)
But not for the _error file. I don't get why.
Logs
map: "{\"version\":3,\"file\":\"_error.svelte\",\"sources\":[\"_error.svelte\"],\"sourcesContent\":[\"<script src=\\\"./_error.js\\\">export let status;\\nexport let error;\\n\\nconst dev = "development" === 'development';\\n</script>\\n\\n<svelte:head>\\n <title>{status}</title>\\n</svelte:head>\\n\\n<h1>{status}</h1>\\n\\n<p>{error.message}</p>\\n\\n{#if dev && error.stack}\\n <pre>{error.stack}</pre>\\n{/if}\\n\\n<style lang=\\\"scss\\\">h1 {\\n font-size: 2.8em;\\n font-weight: 700;\\n margin: 0 0 0.5em 0;\\n}\\n@media (min-width: 480px) {\\n h1 {\\n font-size: 4em;\\n }\\n}\\n\\np {\\n margin: 1em auto;\\n}</style>\\n\"],\"names\":[],\"mappings\":\"AAkBmB,EAAE,cAAC,CAAC,AACrB,SAAS,CAAE,KAAK,CAChB,WAAW,CAAE,GAAG,CAChB,MAAM,CAAE,CAAC,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,AACrB,CAAC,AACD,MAAM,AAAC,YAAY,KAAK,CAAC,AAAC,CAAC,AACzB,EAAE,cAAC,CAAC,AACF,SAAS,CAAE,GAAG,AAChB,CAAC,AACH,CAAC,AAED,CAAC,cAAC,CAAC,AACD,MAAM,CAAE,GAAG,CAAC,IAAI,AACl
SyntaxError: Unexpected identifier
at Module._compile (internal/modules/cjs/loader.js:872:18)
at Object.Module._extensions..js (internal/modules/cjs/loader.js:947:10
To Reproduce
- You can use my yeoman generator (https://www.npmjs.com/package/generator-svalter) to create a new sapper project with the "external/separated script files" setup. (Other choices don't matter)
- In the src/routes/_error.svelte file, copy the content of the script tag and put it in a _error.js file
- in the src/routes/_error.svelte file, replace the script tag per :
<script src="./_error.js"></script>
Expected behavior
That the server side compiles the file
Stacktraces
Stack trace
map: "{\"version\":3,\"file\":\"_error.svelte\",\"sources\":[\"_error.svelte\"],\"sourcesContent\":[\"<script src=\\\"./_error.js\\\">export let status;\\nexport let error;\\n\\nconst dev = "development" === 'development';\\n</script>\\n\\n\\n <title>{status}</title>\\n\\n\\n{status}
\\n\\n{error.message}
\\n\\n{#if dev && error.stack}\\n{error.stack}\\n{/if}\\n\\n<style lang=\\\"scss\\\">h1 {\\n font-size: 2.8em;\\n font-weight: 700;\\n margin: 0 0 0.5em 0;\\n}\\n@media (min-width: 480px) {\\n h1 {\\n font-size: 4em;\\n }\\n}\\n\\np {\\n margin: 1em auto;\\n}</style>\\n\"],\"names\":[],\"mappings\":\"AAkBmB,EAAE,cAAC,CAAC,AACrB,SAAS,CAAE,KAAK,CAChB,WAAW,CAAE,GAAG,CAChB,MAAM,CAAE,CAAC,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,AACrB,CAAC,AACD,MAAM,AAAC,YAAY,KAAK,CAAC,AAAC,CAAC,AACzB,EAAE,cAAC,CAAC,AACF,SAAS,CAAE,GAAG,AAChB,CAAC,AACH,CAAC,AAED,CAAC,cAAC,CAAC,AACD,MAAM,CAAE,GAAG,CAAC,IAAI,AACl
SyntaxError: Unexpected identifier
at Module._compile (internal/modules/cjs/loader.js:872:18)
at Object.Module._extensions..js (internal/modules/cjs/loader.js:947:10)
at Module.load (internal/modules/cjs/loader.js:790:32)
at Function.Module._load (internal/modules/cjs/loader.js:703:12)
at Function.Module.runMain (internal/modules/cjs/loader.js:999:10)
at internal/main/run_main_module.js:17:11
Information about your Sapper Installation:
- The output of
npx envinfo --system --npmPackages svelte,sapper,rollup,webpack --binaries --browsers
System:
OS: Windows 10 10.0.18363
CPU: (12) x64 Intel(R) Core(TM) i7-8700 CPU @ 3.20GHz
Memory: 16.09 GB / 31.82 GB
Binaries:
Node: 12.10.0 - F:\Dev\SDKs\nodejs\node.EXE
Yarn: 1.17.3 - F:\Dev\SDKs\yarn\bin\yarn.CMD
npm: 6.14.7 - F:\Dev\SDKs\nodejs\npm.CMD
Browsers:
Chrome: 84.0.4147.105
Edge: Spartan (44.18362.449.0)
Internet Explorer: 11.0.18362.1
npmPackages:
rollup: ^2.23.1 => 2.23.1
sapper: ^0.28.0 => 0.28.0
svelte: ^3.24.1 => 3.24.1
Severity
Minor+
Notes
That script file separation works with other files like _layout, and other component