Skip to content
This repository was archived by the owner on Jan 11, 2023. It is now read-only.
This repository was archived by the owner on Jan 11, 2023. It is now read-only.

External javascript files (with svelte-preprocess) for the _error component #1374

Open
@Nokorbis

Description

@Nokorbis

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

image

        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

Metadata

Metadata

Assignees

No one assigned

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions