Skip to content

Module parsing fails when SFC has a custom block #76

Open
@welluh

Description

@welluh

When I have set components: true in nuxt.config.js, importing any component that has a custom tag with markdown content will result in error Module parse failed: Unexpected character '#', You may need an additional loader to handle the result of these loaders.

I am using vue-styleguidist to document component libraries, so component libraries are Vue plugins and components are imported for example like this import { SomeComponent } from '@namespace/components. Why does nuxt/components even try to autoload components outside of the components directory?

To Reproduce
I have created a fork with fixtures to demonstrate this behaviour.

Steps to reproduce:

  1. Clone repository $ git clone [email protected]:welluh/components.git
  2. $ git checkout ignore-docs-tag
  3. Run $ yarn install && yarn test
  4. See error

Expected behavior
I would expect custom blocks to be ignored completely and documentation to have steps that can be followed when indeed content from custom blocks are wanted for rendering.

Additional context
I tried to apply something like this to the webpack loader rules (see src/docs-loader.ts), but felt pretty lost how to make it work here.

I can confirm I was able to resolve this locally by following instructions here and adding the loader via nuxt.config.js like this:

build: {
  extend(config) {
    config.module.rules.push({
      resourceQuery: /blockType=docs/,
      loader: require.resolve('./loaders/docs-loader.js')
    })
  }
}

Metadata

Metadata

Assignees

No one assigned

    Labels

    bugSomething isn't working

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions