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

Question

I\'m using the latest stable version of Material UI in my production React app.

I need the updated Data Tables component, which is currently in Material UI\'s unstab

Answer 1

After some googling, found 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'

Answer 2

I created in /packages a folder called material-ui-next with only a 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 from the root of the project one can do npm install packages/material-ui-next --save then one can createPalette = require('material-ui-next/styles/palette') or whatever one wants to require from material-ui now aliased as material-ui-next.

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