unexpected behavior when run `npm run dev` after set config.paths.base in svelte.config.js #2465

xcao38 · 2021-09-20T21:21:29Z

Describe the bug

After set config as following in svelte.config.js:

/** @type {import('@sveltejs/kit').Config} */
import node from '@sveltejs/adapter-node';

const config = {
	kit: {
		// hydrate the <div id="svelte"> element in src/app.html
		target: '#svelte',
		adapter: node({
			// default options are shown
			out: 'build',
			precompress: false,
			env: {
				host: 'HOST',
				port: 'PORT'
			}
		}),
		paths: {
			assets: '',
			base: '/testdir'
		}
	}
};

export default config;

Run npm run dev:
In http://localhost:3000/testdir, I got the following:

Error: Not found: 
    at resolve (file:///Users/xiaofengcao/projects/svelte/my-app/node_modules/@sveltejs/kit/dist/ssr.js:1728:13)
    at async Object.handle (//Users/xiaofengcao/projects/svelte/my-app/src/hooks:13:19)
    at async respond (file:///Users/xiaofengcao/projects/svelte/my-app/node_modules/@sveltejs/kit/dist/ssr.js:1675:10)
    at async svelteKitMiddleware (file:///Users/xiaofengcao/projects/svelte/my-app/node_modules/@sveltejs/kit/dist/chunks/index.js:4531:22)

Run npm run build & npm run preview:

app was successfully built
after npm run preview, a lot of js and css file did not picked up, please see the errors in the web console.

Reproduction

Step 1: start a sveltekit app: https://kit.svelte.dev/

npm init svelte@next my-app
cd my-app
npm install
npm run dev -- --open

Step 2: change svelte.config.js to following:

/** @type {import('@sveltejs/kit').Config} */
import node from '@sveltejs/adapter-node';

const config = {
	kit: {
		// hydrate the <div id="svelte"> element in src/app.html
		target: '#svelte',
		adapter: node({
			// default options are shown
			out: 'build',
			precompress: false,
			env: {
				host: 'HOST',
				port: 'PORT'
			}
		}),
		paths: {
			assets: '',
			base: '/testdir'
		}
	}
};

export default config;

Step 3: install @sveltejs/adapter-node

npm i -D @sveltejs/adapter-node@next

Then run npm run dev or npm run build and npm run preview.

Logs

No response

System Info

npx: installed 1 in 1.189s

  System:
    OS: macOS 11.5.2
    CPU: (12) x64 Intel(R) Core(TM) i7-9750H CPU @ 2.60GHz
    Memory: 11.10 GB / 32.00 GB
    Shell: 3.2.57 - /bin/bash
  Binaries:
    Node: 14.17.3 - /usr/local/bin/node
    Yarn: 1.22.10 - /usr/local/bin/yarn
    npm: 6.14.13 - /usr/local/bin/npm
  Browsers:
    Chrome: 93.0.4577.82
    Firefox: 90.0.2
    Safari: 14.1.2
  npmPackages:
    @sveltejs/adapter-node: ^1.0.0-next.49 => 1.0.0-next.49 
    @sveltejs/kit: next => 1.0.0-next.170 
    svelte: ^3.34.0 => 3.42.6

Severity

blocking all usage of SvelteKit

Additional Information

We are trying to release a sveltekit app under a sub url. This is seriously blocking our deployment.

The text was updated successfully, but these errors were encountered:

benmccann · 2021-09-20T21:55:52Z

We just released a change affecting kit.paths.base (changelog. CC @Karlinator). Do you get the same error with version 1.0.0-next.169?

Karlinator · 2021-09-20T22:01:44Z

This is only an issue in preview, right? I think this is just #2409 showing up?

Does it run correctly with npm run dev and when using the node adapter (node build after npm run build)? If it does, then this should be fixed by #2409

xcao38 · 2021-09-20T22:22:47Z

This is only an issue in preview, right? I think this is just #2409 showing up?

Does it run correctly with npm run dev and when using the node adapter (node build after npm run build)? If it does, then this should be fixed by #2409

@benmccann @Karlinator thanks. Do you mind show me the command to upgrade to the latest version?

Karlinator · 2021-09-20T22:29:13Z

@xcao38 #2409 isn't merged yet, so you won't get it even with upgrading. It'll probably be live soon-ish though. If your package.json has explicit version names (say, 1.0.0-next.169) you can just change that and run npm i. Also npm i -D @sveltejs/kit@1.0.0-next.170 will do the trick. If you have the version just specified as next then a simple npm update (or npm update @sveltejs/kit I think) will update.

benmccann · 2021-09-20T22:38:51Z

This is only an issue in preview, right?

Not according to the issue report which says its an issue in dev and preview:

Then run npm run dev or npm run build and npm run preview.

Karlinator · 2021-09-20T22:50:42Z

Ugh, my eyes betray me.

There might be a similar issue in the dev server, I haven't looked. I'm not as familiar with Vite and all that, but that would be my guess.

There is this line:

kit/packages/kit/src/core/dev/index.js

Line 296 in 7dec53e

if (!parsed.pathname.startsWith(config.kit.paths.base)) return not_found(res);

Maybe assets are rejected at that point?

Karlinator · 2021-09-20T23:23:43Z

@xcao38 do you have the full path of the files the browser is requesting? Is it requesting all assets in the correct locations (/testdir/_app/whatever) in both dev and preview (and are the paths the same in dev and preview)?

If those paths are all correct then I think we have one bug in preview (already known) and a separate but similar bug in dev (manifests the same, but caused differently since dev and preview servers are quite different internally, what with Vite etc).

xcao38 · 2021-09-20T23:28:08Z

@xcao38 do you have the full path of the files the browser is requesting? Is it requesting all assets in the correct locations (/testdir/_app/whatever) in both dev and preview (and are the paths the same in dev and preview)?

If those paths are all correct then I think we have one bug in preview (already known) and a separate but similar bug in dev (manifests the same, but caused differently since dev and preview servers are quite different internally, what with Vite etc).

I could show you my file structure. Not sure where to find the files... Let me know if you need anything :)

Karlinator · 2021-09-20T23:37:27Z

I meant the network log from the browser 😅 I want to see if the links and source urls embedded into the page are correct. In your devtools 'Network' tab you can click on the requests and just see if the Request URLs all have '/testdir/' in them. They should look like localhost:3000/testdir/_app/pages/whatever. If tehy look like localhost:3000/_app/pages/whatever (without 'testdir' in tehm) then we have a different problem.

xcao38 · 2021-09-20T23:44:04Z

I meant the network log from the browser 😅 I want to see if the links and source urls embedded into the page are correct. In your devtools 'Network' tab you can click on the requests and just see if the Request URLs all have '/testdir/' in them. They should look like localhost:3000/testdir/_app/pages/whatever. If tehy look like localhost:3000/_app/pages/whatever (without 'testdir' in tehm) then we have a different problem.

Here you go:

xcao38 · 2021-09-22T14:55:49Z

Hi @Karlinator thanks for the quick turnaround! Just curious, is there a timeline on releasing the new updates on paths.base?

benmccann · 2021-09-22T15:43:24Z

The pretender change is in 170 and the preview mode change is in 171: https://github.com/sveltejs/kit/blob/master/packages/kit/CHANGELOG.md

Karlinator · 2021-09-22T15:53:57Z

I don't think 170 or 171 actually fixes the dev mode issue here. 170 fixed an issue in pre-rendering, 171 fixed an issue in the preview server. I haven't had time to reproduce and go digging, but it looks like there's a separate issue in the dev server.

xcao38 · 2021-09-22T16:56:55Z

@benmccann @Karlinator Thanks both for your time! FWIW, I upgraded my sveltekit to 171 with following:
npm add -D @sveltejs/kit@1.0.0-next.171.

Then I run npm run build and npm run preview, the problem with assets not found is gone. What I can see on my screen and console is as following:

Broswer:

Console:

Terminal:

(base) Xiaofengs-MacBook-Pro:my-app xiaofengcao$ npm run preview

> my-app@0.0.1 preview /Users/xiaofengcao/projects/svelte/my-app
> svelte-kit preview


  SvelteKit v1.0.0-next.171

  local:   http://localhost:3000
  network: not exposed

  Use --host to expose server to other devices on this network

My package.json

{
  "name": "my-app",
  "version": "0.0.1",
  "scripts": {
    "dev": "svelte-kit dev",
    "build": "svelte-kit build",
    "preview": "svelte-kit preview"
  },
  "devDependencies": {
    "@sveltejs/adapter-node": "^1.0.0-next.49",
    "@sveltejs/kit": "^1.0.0-next.171",
    "svelte": "^3.34.0"
  },
  "type": "module",
  "dependencies": {
    "@fontsource/fira-mono": "^4.5.0",
    "@lukeed/uuid": "^2.0.0",
    "cookie": "^0.4.1"
  }
}

Karlinator · 2021-09-22T17:33:00Z

I believe you need the trailing slash, so localhost:3000/testdir/.

xcao38 · 2021-09-22T18:02:06Z

I believe you need the trailing slash, so localhost:3000/testdir/.

Thank you! very helpful. Yeah it did the trick:)

maiertech · 2021-09-29T20:48:55Z

This is still an issue in 177. Once you revert to Vite for previewing, will this fix the issue when there is no trailing /?

benmccann · 2021-09-29T21:21:04Z

I don't think we'll use Vite for preview mode actually. What they do for their preview mode is too different (e.g. it doesn't do SSR at all)

benmccann · 2022-01-20T19:32:03Z

Closing this as a duplicate of #2958

xcao38 closed this as completed Sep 20, 2021

xcao38 reopened this Sep 20, 2021

Karlinator mentioned this issue Sep 21, 2021

[fix] strip paths.base before resolving assets in preview server. #2409

Merged

5 tasks

benmccann changed the title ~~unexpected behavior when run npm run dev and npm run build after set config.paths.base in svelte.config.js~~ unexpected behavior when run npm run dev after set config.paths.base in svelte.config.js Sep 22, 2021

benmccann added this to the 1.0 milestone Jan 18, 2022

benmccann added the bug Something isn't working label Jan 18, 2022

benmccann closed this as completed Jan 20, 2022

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

unexpected behavior when run `npm run dev` after set config.paths.base in svelte.config.js #2465

unexpected behavior when run `npm run dev` after set config.paths.base in svelte.config.js #2465

xcao38 commented Sep 20, 2021 •

edited by benmccann

benmccann commented Sep 20, 2021

Karlinator commented Sep 20, 2021

xcao38 commented Sep 20, 2021 •

edited

Karlinator commented Sep 20, 2021

benmccann commented Sep 20, 2021

Karlinator commented Sep 20, 2021

Karlinator commented Sep 20, 2021

xcao38 commented Sep 20, 2021

Karlinator commented Sep 20, 2021

xcao38 commented Sep 20, 2021 •

edited

xcao38 commented Sep 22, 2021

benmccann commented Sep 22, 2021 •

edited

Karlinator commented Sep 22, 2021

xcao38 commented Sep 22, 2021 •

edited

Karlinator commented Sep 22, 2021

xcao38 commented Sep 22, 2021

maiertech commented Sep 29, 2021

benmccann commented Sep 29, 2021

benmccann commented Jan 20, 2022

unexpected behavior when run npm run dev after set config.paths.base in svelte.config.js #2465

unexpected behavior when run npm run dev after set config.paths.base in svelte.config.js #2465

Comments

xcao38 commented Sep 20, 2021 • edited by benmccann

Describe the bug

Reproduction

Logs

System Info

Severity

Additional Information

benmccann commented Sep 20, 2021

Karlinator commented Sep 20, 2021

xcao38 commented Sep 20, 2021 • edited

Karlinator commented Sep 20, 2021

benmccann commented Sep 20, 2021

Karlinator commented Sep 20, 2021

Karlinator commented Sep 20, 2021

xcao38 commented Sep 20, 2021

Karlinator commented Sep 20, 2021

xcao38 commented Sep 20, 2021 • edited

xcao38 commented Sep 22, 2021

benmccann commented Sep 22, 2021 • edited

Karlinator commented Sep 22, 2021

xcao38 commented Sep 22, 2021 • edited

Broswer:

Console:

Terminal:

My package.json

Karlinator commented Sep 22, 2021

xcao38 commented Sep 22, 2021

maiertech commented Sep 29, 2021

benmccann commented Sep 29, 2021

benmccann commented Jan 20, 2022

unexpected behavior when run `npm run dev` after set config.paths.base in svelte.config.js #2465

unexpected behavior when run `npm run dev` after set config.paths.base in svelte.config.js #2465

xcao38 commented Sep 20, 2021 •

edited by benmccann

xcao38 commented Sep 20, 2021 •

edited

xcao38 commented Sep 20, 2021 •

edited

benmccann commented Sep 22, 2021 •

edited

xcao38 commented Sep 22, 2021 •

edited