Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Inject mdx compiler for mdx1 #556

Merged
merged 5 commits into from Feb 10, 2023
Merged

Inject mdx compiler for mdx1 #556

merged 5 commits into from Feb 10, 2023

Conversation

IanVS
Copy link
Member

@IanVS IanVS commented Feb 7, 2023 •
edited

fixes #557

I found that mdx was not working correctly here, and @valentinpalkovic realized my fallback in Storybook 7 wasn't either (storybookjs/storybook#20823). It was because we used to inject the mdx compiler into the source code that we get back from the @storybook/mdx1-csf compiler, but we lost that in https://github.com/storybookjs/builder-vite/pull/548/files#diff-f2dfc4dfa9074d77a728a88e6629a1d66be8a0765cab8562526cd00fbae910e5L6. This re-introduces it, with a bit better of a guarantee that the correct version is going to be loaded, by starting from inside @storybook/mdx1-csf.

I've also pinned mdx1-csf here, in case the import is moved from the loader to the compiler, as @shilman has suggested doing. We'll need to adjust this if that happens.

@IanVS IanVS mentioned this pull request Feb 7, 2023
Closed
@IanVS
Copy link
Member Author

IanVS commented Feb 7, 2023

Hm, based on the CI failures we might need to also require react to be a peer dependency like we do in SB 7. :-/

@IanVS IanVS mentioned this pull request Feb 7, 2023
Open
1 task
@joshwooding
Copy link
Collaborator

Looks good. :)

@IanVS
Copy link
Member Author

IanVS commented Feb 10, 2023

Turns out that rollup does not respect NODE_PATH, so we need to do a bit of resolution hackery to get it to resolve react relative to the example, and not from within builder-vite's node_modules. Normal projects will not need to worry about this, it's just due to our non-standard multi-project example structure.

@socket-security
Copy link

Socket Security Pull Request Report

Dependency issues detected. If you merge this pull request, you will not be alerted to the instances of these issues again.

📜 Install scripts

Install scripts are run when the package is installed. The majority of malware in npm is hidden in install scripts.

Packages should not be running non-essential scripts during install and there are often solutions to problems people solve with install scripts that can be run at publish time instead.

Package Script field Source
@swc/core@1.3.34 (upgraded) postinstall examples/react-18/package.json via @vitejs/plugin-react-swc@3.1.0, packages/builder-vite/package.json via @vitejs/plugin-react-swc@3.1.0
⚠️ New author

A new npm collaborator published a version of the package for the first time. New collaborators are usually benign additions to a project, but do indicate a change to the security surface area of a package.

Scrutinize new collaborator additions to packages because they now have the ability to publish code into your dependency tree. Packages should avoid frequent or unnecessary additions or changes to publishing rights.

Package New Author Previous Author Source
regexpu-core@5.3.0 (upgraded) nicolo-ribaudo google-wombot examples/lit-ts/package.json via @storybook/addon-essentials@6.5.16, @storybook/builder-vite@0.4.0, @storybook/test-runner@0.1.0, @storybook/web-components@6.5.16, examples/preact/package.json via @storybook/addon-essentials@6.5.16, @storybook/builder-vite@0.4.0, @storybook/preact@6.5.16, @storybook/test-runner@0.1.0, examples/react/package.json via @storybook/addon-docs@6.5.16, @storybook/addon-essentials@6.5.16, @storybook/builder-vite@0.4.0, @storybook/react@6.5.16, @storybook/test-runner@0.1.0, examples/react-18/package.json via @storybook/addon-docs@6.5.16, @storybook/addon-essentials@6.5.16, @storybook/builder-vite@0.4.0, @storybook/react@6.5.16, @storybook/test-runner@0.1.0, examples/react-ts/package.json via @storybook/addon-docs@6.5.16, @storybook/addon-essentials@6.5.16, @storybook/builder-vite@0.4.0, @storybook/react@6.5.16, @storybook/test-runner@0.1.0, examples/svelte/package.json via @storybook/addon-essentials@6.5.16, @storybook/addon-svelte-csf@2.0.11, @storybook/builder-vite@0.4.0, @storybook/svelte@6.5.16, @storybook/test-runner@0.1.0, examples/vue2.6/package.json via @storybook/addon-essentials@6.5.16, @storybook/builder-vite@0.4.0, @storybook/test-runner@0.1.0, @storybook/vue@6.5.16, examples/vue2.7/package.json via @storybook/addon-essentials@6.5.16, @storybook/builder-vite@0.4.0, @storybook/test-runner@0.1.0, @storybook/vue@6.5.16, examples/vue3/package.json via @storybook/addon-essentials@6.5.16, @storybook/addon-interactions@6.5.9, @storybook/builder-vite@0.4.0, @storybook/test-runner@0.5.0, @storybook/vue3@6.5.9, examples/workspaces/package.json via @storybook/test-runner@0.1.0, examples/workspaces/packages/catalog/package.json via @storybook/addon-essentials@6.5.16, @storybook/builder-vite@0.4.0, @storybook/react@6.5.16, packages/builder-vite/package.json via @storybook/addon-svelte-csf@2.0.11, @storybook/core-common@6.5.16
Pull request report summary
Issue Status
Install scripts ⚠️ 1 issue
Native code ✅ 0 issues
Bin script confusion ✅ 0 issues
Bin script shell injection ✅ 0 issues
Shell access ✅ 0 issues
Uses eval ✅ 0 issues
Unresolved require ✅ 0 issues
Invalid package.json ✅ 0 issues
HTTP dependency ✅ 0 issues
Git dependency ✅ 0 issues
GitHub dependency ✅ 0 issues
New author ⚠️ 1 issue
Potential typo squat ✅ 0 issues
Known Malware ✅ 0 issues
Telemetry ✅ 0 issues
Protestware/Troll package ✅ 0 issues
AI detected malware ✅ 0 issues
Bot Commands

To ignore an alert, reply with a comment starting with @SocketSecurity ignore followed by a space separated list of package-name@version specifiers. e.g. @SocketSecurity ignore foo@1.0.0 bar@2.4.2

  • @SocketSecurity ignore @swc/core@1.3.34
  • @SocketSecurity ignore regexpu-core@5.3.0

Powered by socket.dev

@IanVS
Use slash to build windows paths
6fe646b 
resolveId wants an os-compatible absolute path.  🙄
@IanVS
Use path.resolve instead of slash
5e198d7
@IanVS
Copy link
Member Author

IanVS commented Feb 10, 2023

@joshwooding I'm having trouble with Windows here. Any chance you can give this a shot?

@zhyd1997
Copy link

zhyd1997 commented Feb 10, 2023 •
edited

Hi @IanVS

from issue 21023

CI passed when enabled previewMdx2:

Screenshot 2023-02-10 at 18 52 37

https://github.com/zhyd1997/builder-vite/pull/2/files/5e198d79e680ddc8047238a8e8e6f0ffe83c2ab6..824c0585f12824f6f08a18f2d526dcfe81673987

so maybe this is mdx1-csf transform issue: 👀

builder-vite/packages/builder-vite/plugins/mdx-plugin.ts

Lines 20 to 26 in 4d49af6

async transform(src, id) {
if (id.match(/\.mdx?$/)) {
// @ts-ignore
const { compile } = features?.previewMdx2
? await import('@storybook/mdx2-csf')
: await import('@storybook/mdx1-csf');

@IanVS
Copy link
Member Author

IanVS commented Feb 10, 2023

Yes, mdx1 requires us to inject an import into the code, and the yarn portal we are using for the examples doesn't seem to be working very well, because imports in builder-vite are not resolving back to the example's node_modules without some help. It's working fine on posix systems, but not windows. I'm tempted to merge anyway and hope that Josh can get our CI green later. It's only an issue in our examples I believe.

@IanVS IanVS merged commit f881fc9 into main Feb 10, 2023
@IanVS IanVS deleted the fix-mdx-1 branch February 10, 2023 16:32
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Reviewers

@joshwooding joshwooding Awaiting requested review from joshwooding

Assignees
No one assigned
Labels
None yet
Projects
None yet
Milestone
No milestone
Development

Successfully merging this pull request may close these issues.

[Bug] Latest released version fails to build .mdx stories
3 participants
@IanVS @joshwooding @zhyd1997