storybookjs / storybook

Storybook is the industry standard workshop for building, documenting, and testing UI components in isolation
https://storybook.js.org
MIT License
84.69k stars 9.32k forks source link

Compatibility with absolute import paths #3438

Closed abecks closed 6 years ago

abecks commented 6 years ago

Can Storybook be made compatible with absolute import paths:

import { Module } from '/imports/module'

I am working on adding Storybook to a Meteor project, and I store all my app code under <project root>/src. I'd like Storybook to map all absolute imports (starting with a "/" character) to src/*

This is brought up here and here but a solution hasn't been found yet.

I've tried all of the posted solutions I could find, including messing with webpack's resolvers config and various babel plugins.

Whenever I try to make my own babelrc it breaks Storybook's ability to parse React. I can't find the default babelrc config for Storybook anywhere.

I'd appreciate any suggestions!

Hypnosphi commented 6 years ago

Whenever I try to make my own babelrc it breaks Storybook's ability to parse React

Adding React preset should be enough

But AFAIK there is some more fundamental problem with using meteor imports, see #3329

abecks commented 6 years ago

Thanks for pointing me in the right direction, I got this working with:

{
    "presets": ["env", "react", "stage-0"],
    "plugins": [
        [
            "babel-root-slash-import",
            {
                "rootPathSuffix": "src"
            }
        ]
    ]
}

I'm aware of the issue importing Meteor packages. I'm taking care to build "dumb" UI components that do not import any Meteor packages.