vuejs / vitepress

Vite & Vue powered static site generator.
https://vitepress.dev
MIT License
12.59k stars 2.05k forks source link

bug: Typescript data loaders from a package don't build correctly #2179

Open JohnCampionJr opened 1 year ago

JohnCampionJr commented 1 year ago

Describe the bug

I want to put some data loaders into a re-usable template package but it seems in this scenario, they are not processed by VitePress.

Reproduction

This repo/branch demonstrates that its not being processed: https://github.com/jcamp-test/vitepress-theme-starter/tree/data-loader

failed to load config from /Users/john/Git/jcamp-test/vitepress-theme-starter/dist/themecontent.data.js
Build failed with 1 error:
dist/themecontent.data.js:2:9: ERROR: "data" is not declared in this file
11:54:52 AM [vitepress] Internal server error: Build failed with 1 error:
dist/themecontent.data.js:2:9: ERROR: "data" is not declared in this file

Expected behavior

Should work as normal

System Info

System:
    OS: macOS 13.3
    CPU: (12) arm64 Apple M2 Pro
    Memory: 68.20 MB / 16.00 GB
    Shell: 5.9 - /bin/zsh
  Binaries:
    Node: 18.14.1 - /usr/local/bin/node
    npm: 9.5.0 - /usr/local/bin/npm
  Browsers:
    Chrome: 111.0.5563.146
    Firefox: 110.0
    Safari: 16.4
  npmPackages:
    vitepress: 1.0.0-alpha.64 => 1.0.0-alpha.64

Additional context

No response

Validations

JohnCampionJr commented 1 year ago

So I've figured out the cause but not yet sure best way to fix. Given this data loader in the theme:

// themecontent.data.ts
import { createContentLoader } from 'vitepress';
export { data };
export default createContentLoader('*.md' /* options */);

Gets transpiled to

// themecontent.data.js
import { createContentLoader } from 'vitepress';
export { data };
export default createContentLoader('*.md' /* options */);

(Note the .js)

Then when the staticDataPlugin tries to load that one with Vite, it throws the error on this:

export { data };

Which makes sense because that is no longer needed as it is a TypeScript construct.

If I take the line out in the dist files, it works as expected.

JohnCampionJr commented 1 year ago

So there is a workaround:

Use .js for the theme's data loader

And then then a types file to get proper typing

//themecontent.data.d.ts
declare const data: any
export { data }

Works perfectly while keeping the typing

brc-dd commented 10 months ago

track #3185 here too