Material-ui: [Examples] Not working for 1.0.0-beta.6 release

[magicly]

examples(including create-react-app and nextjs) run failed

git clone repo and checkout v1-beta branch, cd examples/create-react-app(or nextjs)

Versions

• Material-UI: v1-beta

I did what's in readme.md in examples/create-react-app,

npm install
npm run start

then got the error:

TypeError: Cannot read property 'secondary' of undefined
createTypography
node_modules/material-ui/styles/typography.js:52
  49 |   fontFamily: fontFamily,
  50 |   letterSpacing: '-.04em',
  51 |   lineHeight: 1,
> 52 |   color: palette.text.secondary
  53 | },
  54 | display3: {
  55 |   fontSize: 56,
View compiled
createMuiTheme

and when I run examples/nextjs, got the error:

 ERROR  Failed to compile with 1 errors                                                                                                                                   22:05:33

This module was not found:

* material-ui/styles/createMuiTheme in ./styles/context.js

To install it, you can run: npm install --save material-ui/styles/createMuiTheme
(node:83569) DeprecationWarning: Module.chunks: Use Module.forEachChunk/mapChunks/getNumberOfChunks/isInChunk/addChunk/removeChunk instead
> Ready on http://localhost:3000

I checke node_modules/material-ui, and find that there is no createMuiTheme file.

➜  nextjs ls node_modules/material-ui/styles/create*
node_modules/material-ui/styles/createGenerateClassName.js      node_modules/material-ui/styles/createGenerateClassName.js.flow
➜  nextjs cat node_modules/material-ui/package.json
{
  "_from": "material-ui@next",
  "_id": "[email protected]",
  "_inBundle": false,
  "_integrity": "sha1-suzJd5/F6VHPvWikTAGv7kGOvfU=",
  "_location": "/material-ui",
  "_phantomChildren": {},
  "_requested": {
    "type": "tag",
    "registry": true,
    "raw": "material-ui@next",
    "name": "material-ui",
    "escapedName": "material-ui",
    "rawSpec": "next",
    "saveSpec": null,
    "fetchSpec": "next"
  },

Is there anything I did wrong, or sth just broke? any help is welcome, thanks~

[kgregory]

For create-react-app, there is an issue in examples/create-react-app/styles/createContext.js. Since the example is using release 1.0.0-beta.6, it will only work when the createPalette helper is used:

import createPalette from 'material-ui/styles/palette';

const theme = createMuiTheme({
  palette: createPalette({
    primary: purple,
    secondary: green,
  }),
});

For nextjs, there is an issue in examples/nextjs/styles/context.js. the example is using release 1.0.0-beta.6, it will only work when createMuiTheme is imported as follows:

import { createMuiTheme } from 'material-ui/styles';

Edit: These fixes can be used as a work-around until the work done in PR #7934 is published

[kgregory]

This is happening because create-react-app and nextjs have material-ui: next in package.json, which resolves to [email protected] and does not include the recent changes to the palette/theme API done by @oliviertassinari in #7934

This should be fixed by the next release, but until it is published the examples will remain broken.

The advised changes in the comments above could be used in the meantime, but should be unnecessary when the new release is published.

[oliviertassinari]

@kgregory Is right. It's an edge case with an upcoming breaking change we are going to release. Right now, the release of beta.7 is waiting for an automatic documentation generation. This inconsistency would be worse if we release now. In the mean time, have a look at the example for the v1.0.0-beta6 tag https://github.com/callemall/material-ui/tree/v1.0.0-beta.6/examples.