histoire-dev / histoire-dev/histoire

resolve.alias is not working for $app/stores in sveltekit projects

Open
#408 8 comments 0 reactions 0 assignees View on GitHub
to triage
Dominant language
TypeScript
Stars
3.6k
Forks
212
PR merge metrics
No merged PRs in 30d

Description

### Describe the bug

I've checked another issues about `$app/stores`, but it seems like I have another issue.
It looks like resolve section in config ignores `$app/stores`:

When I try to use `$app/stores` in my story:

```js
import { page } from '$app/stores';
```
With following `histoire.config.ts`

```js
import { defineConfig } from 'histoire';
import { HstSvelte } from '@histoire/plugin-svelte';
import { resolve } from 'path';

export default defineConfig({
routerMode: 'hash',
plugins: [HstSvelte()],
vite: {
resolve: {
alias: {
'$app/stores': resolve(__dirname, './stores.mjs')
}
}
}
});
```
I get an error:
```
ReferenceError: __SVELTEKIT_APP_VERSION_POLL_INTERVAL__ is not defined
```

It worked fine with Histoire `0.11.2`, vite `3.5.2` and sveltekit beta

### Reproduction

Repo: https://github.com/EugeneDraitsev/histoire-alias-issue
stackblitz (not sure that it works fine): https://stackblitz.com/edit/sveltejs-kit-template-default-2wzudb?file=src%2Flib%2FTest.story.svelte

Steps to reproduce:
1. Clone https://github.com/EugeneDraitsev/histoire-alias-issue or Create new sveltkit project + setup histoire
2. Run `yarn & yarn story:build` - it will work fine
3. Uncoment `src/lib/Test.story.svelte:3` and run `yarn story:build`
4. See an error!

### System Info

```shell
System:
OS: macOS 13.1
CPU: (10) arm64 Apple M1 Pro
Memory: 99.83 MB / 32.00 GB
Shell: 5.8.1 - /bin/zsh
Binaries:
Node: 18.11.0 - ~/.nvm/versions/node/v18.11.0/bin/node
Yarn: 1.22.19 - /opt/homebrew/bin/yarn
npm: 8.19.2 - ~/.nvm/versions/node/v18.11.0/bin/npm
Browsers:
Chrome: 108.0.5359.124
Firefox Developer Edition: 109.0
Safari: 16.2
npmPackages:
@histoire/plugin-svelte: ^0.12.0 => 0.12.0
histoire: ^0.12.0 => 0.12.0
vite: ^4.0.2 => 4.0.2
```

### Used Package Manager

yarn

### Validations

- [X] Follow our [Code of Conduct](https://github.com/histoire-dev/histoire/blob/main/CODE_OF_CONDUCT.md)
- [X] Read the [Contributing Guidelines](https://github.com/histoire-dev/histoire/blob/main/CONTRIBUTING.md).
- [X] Read the [docs](https://histoire.dev/guide/).
- [X] Check that there isn't [already an issue](https://github.com/histoire-dev/histoire/issues) that reports the same bug to avoid creating a duplicate.
- [X] Check that this is a concrete bug. For Q&A open a [GitHub Discussion](https://github.com/histoire-dev/histoire/discussions).
- [X] The provided reproduction is a [minimal reproducible example](https://stackoverflow.com/help/minimal-reproducible-example) of the bug.

Contributor guide

Open the contributing guide

Research direction

Start with the linked reproduction and its histoire.config.ts, then inspect src/lib/Test.story.svelte and run yarn story:build with the $app/stores import enabled. Done means the SvelteKit story build completes without the __SVELTEKIT_APP_VERSION_POLL_INTERVAL__ error while the configured alias remains usable.

Written by the indexing model from the issue text.

Assessment

Tech stack
typescript, vite
Domain
build-system, frontend
Issue type
Bug
Difficulty
3/5
Estimated time
1-2 days
Activity status
Stale
Clarity
Clearly specified
Newbie friendliness
45/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.