Encountered code component "CustomTab" that was not registered with an importPath

Developer Support
1

Hi thanks for your time.

What are you trying to do?
I have inherited a codebase and am trying to create a new project from it.

What have you tried so far?
I thought if i duplicate the project, then use plasmic sync to pull in all the code into a development branch I would be able to set it up clean and proper. But when running plasmic sync i get many importPath issues.

I have since added the importPath to all the components that have errors in the plasmic-init.ts file, but the sync still fails with

Plasmic error: Encountered code component "CustomTab" that was not registered with an importPath, so we don't know where to import this component from.  Please see https://docs.plasmic.app/learn/code-components-ref/Error: Encountered code component "CustomTab" that was not registered with an importPath, so we don't know where to import this component from.  Please see https://docs.plasmic.app/learn/code-components-ref/

These are the relevant excerpts from the plasmic-init.ts

import CustomTab from './components/custom-plasmic-components/CustomTab'

PLASMIC.registerComponent(CustomTab, {
  name: 'CustomTab',
  importPath: './src/components/custom-plasmic-components/CustomTab.tsx',
  isDefaultExport: true,
  props: {
    defaultActiveTab: 'number',
    tabsBarStyle: 'object',
    allTabsTitle: {
      type: 'array',
      itemType: {
        type: 'object',
        fields: {
          title: 'string',
        },
      },
    },
    children: {
      type: 'slot',
    },
  },
})

I have also tried removing the plasmic-init and setting all the imports in plasmic-host file instead and then using

import { PlasmicCanvasHost, registerComponent } from '@plasmicapp/react-web/lib/host';
import CustomTab from '../components/custom-plasmic-components/CustomTab'

registerComponent(CustomTab, {
  name: 'CustomTab',
  importPath: './custom-plasmic-components/CustomTab.tsx',
  isDefaultExport: true,
  props: {
    defaultActiveTab: 'number',
    tabsBarStyle: 'object',
    allTabsTitle: {
      type: 'array',
      itemType: {
        type: 'object',
        fields: {
          title: 'string',
        },
      },
    },
    children: {
      type: 'slot',
    },
  },
})

But i get the same errors when running plasmic sync. This is the same for all of the components registered in the plasmic init file.

Inititally there was no plasmic.json, but after the sync it looks like this:

{
  "platform": "nextjs",
  "code": {
    "lang": "ts",
    "scheme": "blackbox",
    "reactRuntime": "classic"
  },
  "style": {
    "scheme": "css-modules",
    "defaultStyleCssFilePath": ""
  },
  "images": {
    "scheme": "public-files",
    "publicDir": "../public",
    "publicUrlPrefix": "/"
  },
  "tokens": {
    "scheme": "theo",
    "tokensFilePath": "plasmic-tokens.theo.json"
  },
  "srcDir": "src/components",
  "defaultPlasmicDir": "./plasmic",
  "projects": [],
  "globalVariants": {
    "variantGroups": []
  },
  "wrapPagesWithGlobalContexts": true,
  "nextjsConfig": {
    "pagesDir": "../pages"
  },
  "cliVersion": "0.1.331",
  "$schema": "https://unpkg.com/@plasmicapp/cli@0.1.331/dist/plasmic.schema.json"
}

Thanks again for your help.

Relevant links:

2

Hey @naithan_weigh, welcome to the forum!

Can you confirm if the CustomTab component exists in your codebase at the given path?

3

Hi Sarah,
Thanks for your reply.
I managed to get it through with changes to the directory structure. Attempting to build a new clean project of it now, as plasmic keeps putting the wrong paths in the generated Plasmic files.
Seperate issue, that also happened in that project was that I tried to import from another project but could no longer remove the import from plasmic studio. It comes with the confirmation dialog but once you confirm that you want to delete it, it does not get removed.
Don’t really have to troubleshoot it as I will try on a new duplicate of the source project, but a weird bug non the less.

4

Glad to know that you were able to fix it. Can you please confirm how the directory structure needed to be changed?

As for the other issue, I tried to reproduce it but couldn’t. If the issue persists, you can share the project ids of the origin and destination.

5

Thanks.
Would it be possible to have a private conversation regarding the build?

6

Meanwhile could you remove the import of project 6eL8PhWpaR1A9xHaENhHhB
from project 5FLXn2k1ZocjYkZeLRUTwA

Please do not make any edits in 6eL8PhWpaR1A9xHaENhHhB

7

Re: import issue: The NavBar2 seems to be the culprit somehow. I see that it’s not being used anywhere. Can you remove that first, and then try to remove the 6eL8PhWpaR1A9xHaENhHhB import?

8

Thanks I will try this.

9

Yes this has successfully removed it. Maybe add a notice for this in future versions?

10

That issue was specific to your project (although it is unclear why it was in that state of dependency on Navbar2)