legacy-auth-web

This package provides a set of react-bootstrap tools to allow authentication using the legacy-auth API.

How To Test Your Package Locally

Before publishing, test your package locally using tools like npm link to ensure everything works as expected.

However, using npm link has its flaws. If your components use any hooks like useState, then things are going to fail. This is because the way modules are resolved using that tool, the hooks will be unresolved and you are really going to be frustrated.

What I finally had to do was to hard-link the code into the directory of the target project. A bit of a PITA, but you'll be able to test without problems. And, if you make changes to the hard-linked files, they will be changed in this project as well.

6.1. Using Npm link

npm link is a powerful tool that allows you to create a symbolic link between your local package and another project. This way, you can test your package in another project without having to publish it to npm.

6.2. Navigate to Your Package’s Directory

Open your terminal and navigate to the root directory of your package:

$ cd path/to/legacy-auth-web

6.3. Create a Global Link

Run the following command to create a global link for your package:

$ npm link

6.4. Navigate to Your Test Project where you want to import

Move to the directory of the project where you want to test your stuff. This could be a separate project or a test environment:

$ cd path/to/your/test/project

6.5. Link Your Package

Link your local package to the test project:

$ npm link icons

6.6. Example Usage in Your Test Project

Now that you’ve linked your local icon package to your test project, you can import and use the icons just as you would with any other npm package.

Here’s an example of how you might use your icons in a React component:

// In your React component file
import React from 'react';
import { Icon1, Icon2 } from 'icons';

const MyComponent = () => {
    return (
        <div>
        <Icon1 width={24} height={24} />
        <Icon2 width={24} height={24} />
        </div>
    );
};

export default MyComponent;

Ensure that the icons are rendering correctly in your test project. If you encounter any issues, you can make adjustments to your code in the src directory and re-run the tests.

6.7. Unlinking Your Package

After testing, if you want to unlink your local package, run the following commands:

# In the project where you linked the package
$ npm unlink my-icons-package

# In the directory of your icon package
$ npm -g unlink

Step 7: Login to npm

If you haven’t logged in, use:

$ npm login

Enter your npm username, password, and email.

Step 8: Publish Your Package

Finally, publish your package to npm:

$ npm publish

Congratulations! Your package is now live on the npm registry.

Step 9: Updating Your Package

If you make changes to your code and want to publish an updated version, follow these steps:

1. Update the version in your package.json file.
2. Run npm publish again.