Install / Import

$ yarn add a-module-that-uses-emotion @emotion/react @emotion/styled @mui/material

import { css, useTheme } from "a-module-that-uses-emotion";

Specific imports, only import what you need:

import { css } from "a-module-that-uses-emotion/i-export-css-from-emotion-react";
import { useTheme } from "a-module-that-uses-emotion/i-export-useTheme-from-mui-material-styles";
import MyReactComponent from "a-module-that-uses-emotion/MyReactComponent";

Contributing

Testing your changes in an external app

You have made some changes to the code and you want to test them in your app before submitting a pull request?

Assuming you/my-app have a-module-that-uses-emotion as a dependency.

cd ~/github
git clone https://github.com/you/my-app
cd my-app
yarn

cd ~/github
git clone https://github.com/garronej/a-module-that-uses-emotion
cd a-module-that-uses-emotion
yarn
yarn build
yarn link-in-app my-app
npx tsc -w

# Open another terminal

cd ~/github/my-app
rm -rf node_modules/.cache
yarn start # Or whatever my-app is using for starting the project

You don't have to use ~/github as reference path. Just make sure my-app and a-module-that-uses-emotion are in the same directory.

Note for the maintainer: You might run into issues if you do not list all your singleton dependencies in src/link-in-app.js -> singletonDependencies. A singleton dependency is a dependency that can only be present once in an App. Singleton dependencies are usually listed as peerDependencies example react, @emotion/*.

Releasing

For releasing a new version on GitHub and NPM you don't need to create a tag.
Just update the package.json version number and push.

For publishing a release candidate update your package.json with 1.3.4-rc.0 (.1, .2, ...).
It also work if you do it from a branch that have an open PR on main.

Make sure your have defined the NPM_TOKEN repository secret or NPM publishing will fail.