📦

Publish a module that uses TSS

How to express you dependencies requirements

Your module uses MUI
Your module don't use MUI
package.json
"name": "YOUR_MODULE",
"dependencies": {
    "tss-react": "^4.0.0"
},
"peerDependencies": {
    "react": "^16.8.0 || ^17.0.2 || 18.0.0" ,
    "@mui/material": "^5.0.1",
    "@emotion/react": "^11.4.1",
},
"devDependencies": {
    "@mui/material": "^5.0.1",
    "@emotion/react": "^11.4.1",
    "@emotion/styled": "^11.8.1"
}
​
Your users install your module like that: 
yarn add YOUR_MODULE @mui/material @emotion/react @emotion/styled
The version of @mui/material must be newer or equal to 5.9.3
Regarding SSR setup you can forward your user to the dedicated MUI documentation.
package.json
"name": "YOUR_MODULE",
"dependencies": {
    "tss-react": "^4.0.0"
},
"peerDependencies": {
    "react": "^16.8.0 || ^17.0.2 || ^18.0.0",
    "@emotion/react": "^11.4.1",
},
"devDependencies": {
    "@emotion/react": "^11.4.1"
}
​
Your users install your module like that: 
yarn add YOUR_MODULE @emotion/react
Regarding SSR setup you can forward your user to the dedicated documentation.
In any case, it is of paramount importance that your library supports CSJ and ESM distribution. Please refer to the following discussion for precise instructions and a comprehensive explanation of why this is crucial.  
MUI integration not working in production build · Issue #136 · garronej/tss-react
GitHub
Wherever you make use of nested selectors you must provide a uniqId to make sure your components will works in every SSR setup.
You should avoid using <TssCacheProvider /> or you should make tss-react as peerDependency of your module which you probably want to avoid.  

Detecting unused classes

MUI sx syntax

Last modified 10d ago