Docz: Enabling the parser plugin 'classProperties'

[carrickjason]

Bug Report

docz dev builds and works fine but docz build throws SyntaxError: This experimental syntax requires enabling the parser plugin: 'classProperties'.

I am using babel-plugin-transform-class-properties when i bundle my libraries and my doczrc.js has added the @babel/plugins-syntax-transform-properties

SyntaxError: This experimental syntax requires enabling the parser plugin: 'classProperties' (7:12)
    at _class.raise (/Users/jcarrick/Sites/react-common-components/packages/docs/node_modules/@babel/parser/lib/index.js:3938:15)
    at _class.expectPlugin (/Users/jcarrick/Sites/react-common-components/packages/docs/node_modules/@babel/parser/lib/index.js:5252:18)
    at _class.parseClassProperty (/Users/jcarrick/Sites/react-common-components/packages/docs/node_modules/@babel/parser/lib/index.js:8102:12)
    at _class.pushClassProperty (/Users/jcarrick/Sites/react-common-components/packages/docs/node_modules/@babel/parser/lib/index.js:8066:30)
    at _class.parseClassMemberWithIsStatic (/Users/jcarrick/Sites/react-common-components/packages/docs/node_modules/@babel/parser/lib/index.js:7999:14)
    at _class.parseClassMember (/Users/jcarrick/Sites/react-common-components/packages/docs/node_modules/@babel/parser/lib/index.js:7936:10)
    at _class.parseClassBody (/Users/jcarrick/Sites/react-common-components/packages/docs/node_modules/@babel/parser/lib/index.js:7891:12)
    at _class.parseClass (/Users/jcarrick/Sites/react-common-components/packages/docs/node_modules/@babel/parser/lib/index.js:7841:10)
    at _class.parseStatementContent (/Users/jcarrick/Sites/react-common-components/packages/docs/node_modules/@babel/parser/lib/index.js:7172:21)
    at _class.parseStatement (/Users/jcarrick/Sites/react-common-components/packages/docs/node_modules/@babel/parser/lib/index.js:7144:17)
    at _class.parseBlockOrModuleBlockBody (/Users/jcarrick/Sites/react-common-components/packages/docs/node_modules/@babel/parser/lib/index.js:7695:23)
    at _class.parseBlockBody (/Users/jcarrick/Sites/react-common-components/packages/docs/node_modules/@babel/parser/lib/index.js:7682:10)
    at _class.parseBlock (/Users/jcarrick/Sites/react-common-components/packages/docs/node_modules/@babel/parser/lib/index.js:7671:10)
    at _class.parseFunctionBody (/Users/jcarrick/Sites/react-common-components/packages/docs/node_modules/@babel/parser/lib/index.js:6924:24)
    at _class.parseArrowExpression (/Users/jcarrick/Sites/react-common-components/packages/docs/node_modules/@babel/parser/lib/index.js:6876:10)
    at _class.parseParenAndDistinguishExpression (/Users/jcarrick/Sites/react-common-components/packages/docs/node_modules/@babel/parser/lib/index.js:6492:12)

using [email protected]

doczrc.js

const getRepoInfo = require('git-repo-info')
const tag = getRepoInfo().lastTag

export default {
  title: 'React Component Library',
  description: tag,
  dest: `public`,
  port: 9000,
  theme: 'theme/Theme',
  propsParser: false,
  modifyBabelRc: babelrc => ({
    ...babelrc,
    plugins: [
      '@babel/plugin-syntax-class-properties',
      '@babel/plugin-syntax-object-rest-spread',
      'emotion',
      ...babelrc.plugins
    ]
  })
}

[carrickjason]

This was an issue in our own code base. Someone was defining a class in the children function of the Playground. It might be a good idea to look for this and throw a more helpful error message because it was a tough one to track down.

[BigAB]

This is still a valid bug, because using a class as a child of Playground is a valid option

[trexguo]

Met this issue when using arrow functions for event binding in a class as a child of Playground
I am using typescript with Docz

[pedronauck]

This is something related to react-live that doesn't make parsing using babel 😕

[regrettably]

@pedronauck not sure what that means...is there a workaround for the time being?

[ronghang]

Met this issue when using arrow functions for event binding in a class as a child of Playground
I am using typescript with Docz

Have you solved the problem？ The same problem i have met when i use arrow functions in mdx files.

[GeorgeZhangZHY]

Any updates on how to solve this?
I do need to define a class in children, so my users can edit them rather than some blackbox tag.