Payload v3.0.1 PasswordField import from payload.

isarcasm.xdlast year

13

Import trace for requested module:
./src/app/(payload)/layout.tsx
 ⨯ ./src/app/(payload)/admin/importMap.js:1:1
Module not found: Package path ./PasswordField is not exported from package C:\Engage projects\EngageForLiving.Resident.BackOffice\node_modules\@payloadcms\ui (see exports field in C:\Engage projects\EngageForLiving.Resident.BackOffice\node_modules\@payloadcms\ui\package.json)
> 1 | import { default as default_1e04d1dcd1ddbb01671e738b925b72dc } from '@payloadcms/ui/PasswordField'
    | ^
  2 | import { default as default_0572f93f6687fa358e8d41af47fb5e2a } from 'payload/ui/PasswordField'
  3 | import { default as default_cda2876063da3bfb65932a0d6445b45e } from '@payloadcms/ui/dist/PasswordField'
  4 | import { default as default_9f3e31139b7572fa24c43880850a14d3 } from 'fields/rulesCustomFieldSelect'

admin: {
        components: {
          Field: '@payloadcms/ui/dist/fields/Password#PasswordField',
        },
        disableListFilter: true,
        disableListColumn: true
            },

• 

  rilromlast year

  Could you try

  Field: '@payloadcms/ui#PasswordField'
• 

  isarcasm.xdlast year

  @127418710519578624

  Thanks for the response!

  
  

  Still facing the same error. Do I need to change the importMap location from the app root to the directory root from the payload-config admin object?

  
  
  

  Module not found: Package path ./dist/fields/Password/index.js#PasswordField is not exported from package C:\Engage projects\EngageForLiving.Resident.BackOffice\node_modules@payloadcms\ui (see exports field in C:\Engage projects\EngageForLiving.Resident.BackOffice\node_modules@payloadcms\ui\package.json)

  
  

  1 | import { default as default_1e04d1dcd1ddbb01671e738b925b72dc } from '@payloadcms/ui/dist/fields/Password/index.js#PasswordField'
  

  | ^

  
  

  2 | import { default as default_0572f93f6687fa358e8d41af47fb5e2a } from 'payload/ui/PasswordField'

  
  

  3 | import { default as default_cda2876063da3bfb65932a0d6445b45e } from '@payloadcms/ui/dist/PasswordField'

  
  

  4 | import { default as default_9f3e31139b7572fa24c43880850a14d3 } from 'fields/rulesCustomFieldSelect'

  
  
  @360823574644129795

  can you help out please? Tagged you only cause wasn't able to find any solution to it.

• 

  alessiogr

  last year

  I would search through your project and make sure you're not importing from

  @payloadcms/ui/dist

  anywhere (or use any import string paths that point to it). This will not work if modern module resolution is used

• 

  isarcasm.xdlast year

  @360823574644129795

  Thanks for the reply. I checked out all the refs in my project for

  @payloadcms/ui/dist

  but the only ones were in the importMap. Do I need to change the import at the component level to something else?

  
  
  

  I tried:

  @payloadcms/ui#PasswordField

  ,

  @payloadcms/ui/Fields#PasswordField

  and a few other variations but I am still facing the same error.

• 

  rilromlast year

  Did you run

  pnpm generate:importmap

  ?

• 

  isarcasm.xdlast year

  @127418710519578624

  Yes I did. It has the imports populated. But as Alessio mentioned it has import from dist which it does automatically. Not sure where the issue is

• 

  rilromlast year

  I'll try and reproduce this on my end, one moment

• 

  isarcasm.xdlast year

  Thanks a lot!

• 

  rilromlast year

  '@payloadcms/ui#PasswordField' worked for me.

  
  
  

  I'd recommend creating a fresh project and seeing if it still occurs for you.

• 

  isarcasm.xdlast year

  Oh that's great. I'll try to isolate it to one field and check since we have a lot of collections. Also can you send the importMap imports for password field?

• 

  rilromlast year

  I did the check on another computer but it was roughly like this:

  
  
  

  import { PasswordField as PasswordField_XXXXX } from '@payloadcms/ui'
  
  export const importMap = {
    "@payloadcms/ui#PasswordField": PasswordField_XXXXX
  }

• 

  isarcasm.xdlast year

  Thanks lot for you help. I'll try to go through it again one field at a time.

  
  
  

  Just FYI this is how my importMap looks at the moment I think there might be an issue with the imports itself. It is taking the default imports unlike yours from the

  @payloadcms/ui
  
  

  import { default as default_1e04d1dcd1ddbb01671e738b925b72dc } from '@payloadcms/ui/dist/fields/Password/index.js#PasswordField'
  import { default as default_0572f93f6687fa358e8d41af47fb5e2a } from 'payload/ui/PasswordField'
  import { default as default_cda2876063da3bfb65932a0d6445b45e } from '@payloadcms/ui/dist/PasswordField'
  
  export const importMap = {
    "@payloadcms/ui/PasswordField#default": 
  default_1e04d1dcd1ddbb01671e738b925b72dc,
  }

  
  
  @127418710519578624

  I was able to resolve it. I had ot reset my importMap to

  export const importMap = {}

  and run the generate:importmap to have the correct import. Thank you for your help!

• 

  rilromlast year

  That’s great to hear, no worries!