10 Tips for using Semantic Release

1. Make sure to have the correct name value for the module in package.json. Include a prefix if it is necessary like this, “name”: “@mdhnpm/react-cube-loading-spinner”

2. Make sure to add publishConfig in package.json

"publishConfig": {
    "registry": "https://registry.npmjs.org/"
},

3. Do not set “private”: true if you want to publish the module. If private is true, semantic-release will skip publishing.

4. Include metadata like description, keywords, author, license and repository.

5. Use a tool like commitizen to ensure the commit message follows a conventional commit. Use comitlint in CI for the commit message check.

6. If you are publishing to the Npm repository as a public package, add access=public in .npmrc.

7. Make your package lean by adding `.npmignore` to exclude unnecessary files.

8. If you configured it well, all you need to do in CI is to run npx semantic-release (or npx semantic-release –no-ci).

9. If you want to run it as GitHub Action, use the third party semantic-release action like cycjimmy/semantic-release-action@v2.

10. If you are using AWS CodePipeline, don’t bother. Nah, kidding. You can still use it. See the blog post, here

If you want to see the example of using semantic-release to publish the package to both npm repository and Github repository, checkout the setup for this one: react-cube-loading-spinner.

Front-End
TypeScript: type aliases to check type equality

This post is to analyse how the type equality check by using type aliases proposed by Matt Pocock in his twitter post. These type aliases allow us to elegantly express type equality checks in unit tests. All we need to do is to pass the output and expected types in …

Front-End
Fixing it.only type error in Jest

If you are getting a type error with it.only in Jest, it could be due to incorrect TypeScript typings or incompatible versions of Jest and TypeScript. To resolve this issue, you can try the following steps: Make sure you have the latest versions of Jest and its TypeScript typings installed …

Front-End
yup conditional validation example

Here’s an example of a Yup validation logic where the first input field is optional but, if filled, it must contain only alphabetic characters, and the second input field is required: import * as Yup from “yup”; const validationSchema = Yup.object().shape({ firstField: Yup.string().matches(/^[A-Za-z]*$/, { message: “First field must contain only …