AiTmed's TypeScript/JavaScript SDK Boilerplate
Note: this boilerplate is not intended for react applications. You need to extend this boilerplate with additional configurations if you want this to bundle out to a react library components.
Usage
Put all .js
or .ts
files in src/
directory and make sure they are exported using src/index.ts
. There are a couple of ways to export things out to the output bundle depending on how you want devs to use your library.
For example, for a directory like this:
-
src
createS3Object.ts
deleteS3Object.ts
updateS3Object.ts
makeRequest.ts
index.ts
Your index.ts
file should look like this:
Named exports
export { default as createS3Object } from './createS3Object'
export { default as deleteS3Object } from './deleteS3Object'
export { default as updateS3Object } from './updateS3Object'
export { default as makeRequest } from './makeRequest'
When you npm run build
, it will generate files into the ./dist
directory. This dist
directory will be imported in JavaScript applications like this:
import { createS3Object, makeRequest } from 'js-sdk-boilerplate'
function callSomeApi() {
const req = makeRequest()
return createS3Object(...).then(...).catch(...)
}
Main export (single, main object)
If you want developers to import it and use it like this:
import aitmedSdk from 'js-sdk-boilerplate'
function callSomeApi() {
const req = aitmedSdk.makeRequest()
return aitmedSdk.createS3Object(...).then(...).catch(...)
}
Then the index.ts
file above will not work. You will have to export it differently like this so that it exports a main object:
src/index.ts
import createS3Object from './createS3Object'
import deleteS3Object from './deleteS3Object'
import updateS3Object from './updateS3Object'
import makeRequest from './makeRequest'
// This main object will be exported
export default {
createS3Object,
deleteS3Object,
updateS3Object,
makeRequest,
}
Main export variation #2
You can also make a main object to be exported out by just directly importing and exporting the target file back out:
src/index.ts
export { default } from './someMethodOrSomething'
src/someMethodOrSomething.ts
function someMethod() {
console.log('hello')
return null
}
export default someMethod
Devs can then use the main object like this in their apps:
import someMethodOrWhatever from '@aitmed/js-sdk-boilerplate'
Publishing to NPM
When you want to publish to NPM, type in npm publish
and it will publish the library to NPM.
Since this repo was created using a scope, it should already be private only to NPM users who are members of the aitmed organization on NPM.
The name of this repo is currently @aitmed/js-sdk-boilerplate
and that will be the name the devs will import from in their applications, which is probably what you don't want. Try changing the name
property in package.json
to some name of your choice after the aitmed
part like this:
{
"name": "@aitmed/my-custom-sdk",
"version": "1.0.0",
...
}
To make the package free to the public, instead of typing npm publish
in the CLI you do this:
npm publish --access public
For including typescript definition files coming from outside the repo, try putting them in src/types
and adding that path to typeRoots
or types
in the tsconfig.json
file (not sure if this will work).
Extra dependencies included the project that you might want to use:
Package | Description |
---|---|
dotenv | Loads environment variables from .env for nodejs projects. |
mocha | Test runner. |
chai | Test matchers. |
More info on these dependencies
-
dotenv
- You can put your secret keys/env variables here. Don't let git commit this file if you want to be 100% safe. (Already done in this boilerplate in
.gitignore
) - To enter an environment variable, add a new line in the
.env
file in this format:MY_ENV_VARIABLE=MY_ENV_VARIABLE_VALUE
- You can put your secret keys/env variables here. Don't let git commit this file if you want to be 100% safe. (Already done in this boilerplate in
-
mocha
- Test runner
-
chai
- Test matchers