How to auto-import from component library in node_modules? about sveltekit-autoimport HOT 10 CLOSED

Use module or mapping:

autoImport({
  components: [],

  mapping: {
    SomeLib: `import SomeLib from 'some-lib'`
  }
})

from sveltekit-autoimport.

Do you have an example or docs for these features? I'm not sure how I would use that in my case.

from sveltekit-autoimport.

For example, I have a <Video v="XXXXXX"/> component in my markdown. It comes from import {Video} from tecitheme/components/Video.svelte'

If I add that import line to the script in markdown the component works as expected.

from sveltekit-autoimport.

Yeah there are examples at the bottom of readme file.

autoImport({
  /* .. */
  mapping: {
    Video: `import {Video} from 'tecitheme/components/Video.svelte'`
  }
})

from sveltekit-autoimport.

It means how/where to import the Video component. They can be component, variable, or a function:

autoImport({
  /* .. */
  mapping: {

    VideoX: `import { Video as VideoX } from 'tecitheme/components/Video.svelte'`,

    T: `import T from './lib/language/get-text.js'`,
   
    /* I wouldn't suggest this */
    GLOBAL_VAR: `const GLOBAL_VAR = 'hello world';`,
  }
})

from sveltekit-autoimport.

Ok, instead of mapping all of the components individually, would it be possible to add the node module to the "components" array and have them all imported automatically? That's how it works if they are in a local folder, like ./src/lib/components.

from sveltekit-autoimport.

I suggest import them manually and explicitly for the third-party components. There's also a module option for selecting multiple items for a module.

autoImport({
  /* .. */
  module: {
    'some-component-lib': ['Video', 'Caption']
  }
})

Which means:

import { Video, Caption } from 'some-component-lib'

from sveltekit-autoimport.

Ok this works well for me. Thank you.

from sveltekit-autoimport.

autoImport({
  /* .. */
  module: {
    'some-component-lib': ['Video', 'Caption']
  }
})

How would you do this in my case where the components are in the 'components' subdirectory of the theme?

BTW, the following code works for me now.

mapping: {
    Video: `import Video from 'tecitheme/components/Video.svelte'`
  }

from sveltekit-autoimport.

The package tecitheme is missing an entry file like index.js for exporting all packages outside. So you have to import them one by one

from sveltekit-autoimport.