共享的纱线工作区反应组件Babel错误

时间:2019-04-05 04:34:59

标签: reactjs babel next.js yarn-workspaces

Xena-纱线工作区

  • 组件:共享代码所在的位置
  • admin2-client :CRA react-app要使用组件

单声道回购设置:

xena
  |----- node_modules
  |----- package.json
  |----- admin-client2
     |------ node_modules
     |------ src
     |------ packages.json
  |----- components
     |----- nmds-components
        |----- node_modules
        |----- src
        |----- index.js
        |----- packages.json
    |----- constants
        |----- countries.js
        |----- languages.js
        |----- node_modules
        |----- package.json

共享的React组件不会通过babel进行转译,因此使用该应用的应用会出现babel错误。

  23 | 
  24 | 
> 25 |   dismissError = () => this.setState({ isErrorHidden: true });
     |                ^
  26 | 
  27 |   render() {
  28 |     const { error } = this.props;

Add @babel/plugin-proposal-class-properties (https://git.io/vb4SL) to the 'plugins' section of your Babel config to enable transformation.

我已将.babelrc放入共享的组件文件夹(nmds-component)中。也"source":true到共享组件package.json

root package.json

{
  "name": "xena",
  "version": "0.0.1",
  "description": "NextJS, CRA app monorepo",
  "main": "index.js",
  "repository": "https://github.com/s4kh/xena",
  "author": "skh",
  "license": "MIT",
  "private": true,
  "scripts": {
    "clean": "shx rm -rf **/node_modules",
    "dev-admin2": "yarn workspace admin2-client start"
  },
  "devDependencies": {
    "node-sass-chokidar": "^1.3.3",
    "npm-run-all": "^4.1.3",
    "shx": "^0.3.2"
  },
  "workspaces": [
    "components/*",
    "admin2-client"
  ]
}

admin2-client package.json

{
  "name": "admin2-client",
  "version": "0.1.0",
  "private": true,
  "dependencies": {
    "react": "^16.8.6",
    "react-dom": "^16.8.6",
    "react-scripts": "2.1.8",
    "nmds-components": "1.0.0" << THE SHARED COMPONENT
  },
  "scripts": {
    "start": "react-scripts start",
    "build": "react-scripts build",
    "test": "react-scripts test",
    "eject": "react-scripts eject"
  },
  "eslintConfig": {
    "extends": "react-app"
  },
  "browserslist": [
    ">0.2%",
    "not dead",
    "not ie <= 11",
    "not op_mini all"
  ]
}

我的猜测是react-scripts start不会在node_modules内部转译代码,nmds-components作为符号链接存在于根node_modules内部。

0 个答案:

没有答案