Use components from two versions of the same library (npm / Material UI in my case)

I use the latest stable version of Material UI in my React app to build apps.

I need an updated Data Tables component that is currently in the unstable alpha branch of Material UI.

I do not want to update my entire application with npm i material-ui@next due to numerous violations.

How can I access an alpha library without updating my entire library? Can I install two versions of MUI? Can I call the alpha API without installing it through NPM?

Thanks in advance.

+5
source share
2 answers

After doing some googling, find this . To use both versions:

 yarn add material-ui@latest yarn add material-ui-next@npm : material-ui@next 

Then you can use

 import Divider from 'material-ui-next/Divider' 

or

 import Divider from 'material-ui/Divider' 
+10
source

I created in /packages folder called material-ui-next with just package.json inside it, which contains:

 { "name": "material-ui-next", "version": "1.0.0", "scripts": { "postinstall": "mv node_modules/material-ui/* ." }, "dependencies": { "material-ui": "next" } } 

So now you can make npm install packages/material-ui-next --save from the project root, then you can createPalette = require('material-ui-next/styles/palette') or what is required from material-ui , now an alias as material-ui-next .

Explanations: since "material-ui": "next" is a dependency, it will be installed in node_modules/material-ui , so adding a script after installing the material-ui-next package to move node_modules/material-ui to the package root, we can require('material-ui-next/WHATEVER')

+2
source

Source: https://habr.com/ru/post/1264269/


All Articles