Incorrect README example to import components directly #190

Activity

1. KaiSpencer commented on Jan 20, 2024

   

   KaiSpencer

   on Jan 20, 2024

   Contributor

   More actions

   Thanks @wozzo for this and the reproduction.

   @Tomdango Can you take a look at this?
2. colinrotherham

   changed the title [-]Can't import components directly if using TypeScript.[/-] [+]Incorrect README example to import components directly[/+] on Sep 29, 2025
3. colinrotherham commented on Sep 29, 2025

   

   colinrotherham

   on Sep 29, 2025

   Collaborator

   More actions

   I've renamed the title as this issue is a typo in the README

     // Or you can import components directly
   - import Button from 'nhsuk-react-components/lib/components/button';
   + import Button from 'nhsuk-react-components/dist/esm/components/form-elements/button/Button.js';

   As an enhancement we might want to map lib/* into dist/esm/* using package exports?

       "files": [
   -     "dist",
   -     "lib"
   +     "dist"
       ],
   +   "sideEffects": false,
   +   "exports": {
   +     ".": {
   +       "types": "./dist/index.d.ts",
   +       "import": "./dist/esm/index.js",
   +       "require": "./dist/cjs/index.js",
   +       "default": "./dist/cjs/index.js"
   +     },
   +     "./*": "./*",
   +     "./lib/*": {
   +       "types": "./dist/esm/*",
   +       "import": "./dist/esm/*"
   +     },
   +     "./lib/*.js": "./dist/esm/*.js",
   +     "./package.json": "./package.json"
   +   },
       "main": "dist/cjs/index.js",
   -   "module": "dist/esm",
   +   "module": "dist/esm/index.js",
       "types": "dist/index.d.ts",
4. colinrotherham commented on Oct 14, 2025

   

   colinrotherham

   on Oct 14, 2025

   Collaborator

   More actions

   The old lib path was fixed (now dist) in ee8bb81 via #271
5. colinrotherham

   closed this as completedon Oct 14, 2025