histoire
histoire copied to clipboard
Looking for tailwind dependencies when the project does not use tailwind
Describe the bug
When loading a story, it will try to look for a tailwind dependencies while the project does not use tailwind at all.
Reproduction
Link to minimal reproduction https://github.com/jackysee/histoire_no_tailwind_vue3_setup
- create new project by
npm create vite@latest histoire_no_tailwind_vue3_setup --template vue
. Do thenpm install
-
npm install histoire @histoire/plugin-vue
- create
histoire.config.js
pointing tohistoire.setup.js
//histoire.config.js
import { defineConfig } from "histoire";
import { HstVue } from "@histoire/plugin-vue";
export default defineConfig({
plugins: [HstVue()],
setupFile: "/src/histoire.setup.js",
});
//src/histoire.setup.js
import { defineSetupVue3 } from "histoire";
export const setupVue3 = defineSetupVue3(({ app, story, variant }) => {
app.config.globalProperties.$hello = "hello";
});
- create
src/Main.story.vue
<template>
<Story title="hello">
{{ $hello }}
</Story>
</template>
-
npx histoire dev
- navigate to the
hello
story
It will now throw an error:
3:28:00 PM [vite] Internal server error: Failed to resolve import "tailwindcss/resolveConfig.js" from "node_modules/histoire/dist/node/builtin-plugins/tailwind-tokens.js?v=8ab6a3fb". Does the file exist?
Plugin: vite:import-analysis
File: /home/jackys/works/exp/histoire_no_tailwind_vue3_setup/node_modules/histoire/dist/node/builtin-plugins/tailwind-tokens.js?v=8ab6a3fb
19 | await api.fs.writeFile(api.path.resolve(api.pluginTempDir, 'style.css'), css);
20 | const tailwindConfig = await api.moduleLoader.loadModule(tailwindConfigFile);
21 | const { default: resolveConfig } = await import('tailwindcss/resolveConfig.js');
| ^
22 | const resolvedTailwindConfig = resolveConfig(tailwindConfig);
23 | const storyFile = api.path.resolve(api.pluginTempDir, 'Tailwind.story.js');
at formatError (file:///home/jackys/works/exp/histoire_no_tailwind_vue3_setup/node_modules/vite/dist/node/chunks/dep-665b0112.js:40782:46)
at TransformContext.error (file:///home/jackys/works/exp/histoire_no_tailwind_vue3_setup/node_modules/vite/dist/node/chunks/dep-665b0112.js:40778:19)
at normalizeUrl (file:///home/jackys/works/exp/histoire_no_tailwind_vue3_setup/node_modules/vite/dist/node/chunks/dep-665b0112.js:37514:33)
at async TransformContext.transform (file:///home/jackys/works/exp/histoire_no_tailwind_vue3_setup/node_modules/vite/dist/node/chunks/dep-665b0112.js:37648:47)
at async Object.transform (file:///home/jackys/works/exp/histoire_no_tailwind_vue3_setup/node_modules/vite/dist/node/chunks/dep-665b0112.js:41031:30)
at async loadAndTransform (file:///home/jackys/works/exp/histoire_no_tailwind_vue3_setup/node_modules/vite/dist/node/chunks/dep-665b0112.js:37292:29) (x4)
System Info
System:
OS: Linux 5.4 Manjaro Linux
CPU: (2) x64 Intel(R) Core(TM) i5-5200U CPU @ 2.20GHz
Memory: 1.20 GB / 5.07 GB
Container: Yes
Shell: 5.9 - /usr/bin/zsh
Binaries:
Node: 18.4.0 - /run/user/1000/fnm_multishells/1235818_1662708633849/bin/node
Yarn: 1.22.19 - /usr/bin/yarn
npm: 8.13.2 - /run/user/1000/fnm_multishells/1235818_1662708633849/bin/npm
Browsers:
Firefox: 100.0.2
npmPackages:
@histoire/plugin-vue: ^0.10.7 => 0.10.7
@vitejs/plugin-vue: ^3.0.3 => 3.1.0
vite: ^3.0.9 => 3.1.0
Used Package Manager
npm
Validations
- [X] Follow our Code of Conduct
- [X] Read the Contributing Guidelines.
- [X] Read the docs.
- [X] Check that there isn't already an issue 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.
- [X] The provided reproduction is a minimal reproducible example of the bug.