Plasmic sync not doing relative import paths

@chungwu lmk if you have thoughts and/or are able to chat today. Free at 12pm PT

ah, it’s because there are duplicate copies of @plasmicapp/host…

To fix this, upgrade all of your plasmic dependencies together:

npm upgrade @plasmicapp/loader-nextjs @plasmicapp/react-web @plasmicpkgs/plasmic-cms

and check the same version of host is used everywhere

npm list --packages @plasmicapp/host

We recommend only using one of react-web or loader-nextjs so you don’t end up with duplicate entrypoints

trying now

ok yeah when i ran plasmic sync it asked me for permission to install react-web so i said yes

OK the plasmic-host problem is solved :raised_hands:

So that just leaves the Plasmic CMS issue — @chungwu any ideas on that?

oh wait hold on it may be fixed

Yes, that seems to be fixed now also! @chungwu thanks so much for your help

Great! I’m sorry this was so bumpy :disappointed:

yeah plasmic is so magical when it’s working but definitely feels like beta software still :disappointed:

BTW I still think there is a bug with how codegen generates import paths for code components

I wasn’t able to get it working with my directory structure so i just ended up changing my whole project’s directory structure to match what plasmic expected

so I moved all my existing code from src/components to components

It’s working fine now but obviously that shouldn’t have been necessary

Hi @chungwu is there some reliable way to force plasmic sync to fix all the import statements in its generated components?

It seems really hit or miss

Often I end up having to quit and restart plasmic studio a few times, delete a bunch of generated files, maybe rebuild my next js app and eventually it picks up the changes

hmm you can do plasmic fix-imports . Are the imports wrong right when they are synced?

Just tried plasmic fix-imports but it’s not updating the imports

Maybe something else is going on

I just added the importName and isDefaultExport to the below code in plasmic-init.ts:

//plasmic-init.ts
PLASMIC.registerComponent(Img, {
  name: 'EmailImg',
  props: {
    src: 'string',
    alt: 'string',
    width: 'number',
    height: 'number',
  },
  importPath: '@react-email/img',
  importName: 'EmailImg',
  isDefaultExport: true,
});