'decorators-legacy' issue - 1.7 (mobx issue)

help
1

Hey,

Has anyone successfully updated to 1.7 and uses MobX? MobX uses decorators, which are no longer working because the babel transform is broken.

On start, errors look like:

[[[[[ ~/workspace/meteor/app1 ]]]]]           

=> Started proxy.                             
=> Errors prevented startup:                  
   
   While building for web.browser:
   imports/ui/pages/utility/login.js:16:
   /home/tbanerjee/workspace/meteor/app1/imports/ui/pages/utility/login.js:
   Support for the experimental syntax 'decorators-legacy' isn't currently
   enabled (16:1):
   
   14 | import { validate } from 'isemail';
   15 | 
   > 16 | @observer
   | ^
   17 | export class Login extends Component {
   18 |   @observable emailAddress = String('');
   19 |   @observable emailAddressError = String('');

This is what I have in my dev dependencies.

"devDependencies": {
    "@babel/core": "^7.0.0-beta.46",
    "@babel/plugin-transform-runtime": "^7.0.0-beta.46",
    "@babel/preset-env": "^7.0.0-beta.46",
    "@babel/preset-react": "^7.0.0-beta.46",
    "@babel/preset-stage-2": "^7.0.0-beta.46",
    "babel-eslint": "^7.0.0",
    "chimp": "^0.51.1",
    "eslint": "^3.8.1",
    "eslint-plugin-meteor": "^4.0.1",
    "eslint-plugin-react": "^6.4.1",
    "webpack": "^3.4.1"
  },
  "dependencies": {
    "@babel/runtime": "^7.0.0-beta.46",
    "bcrypt": "^1.0.3",
    "cloudinary": "^1.11.0",
    "draft-js": "^0.10.3",
    "draftjs-to-html": "^0.7.5",
    "draftjs-to-markdown": "^0.4.4",
    "file-saver": "^1.3.3",
    "isemail": "^2.2.1",
    "jwt-simple": "^0.5.1",
    "lodash": "^4.17.10",
    "material-ui": "^0.19.4",
    "media-typer": "^0.3.0",
    "meteor-node-stubs": "^0.2.5",
    "mime": "^2.3.1",
    "mobx": "^4.2.1",
    "mobx-react": "^5.1.2",
    "prop-types": "^15.5.3",
    "react": "^16.3.2",
    "react-color": "^2.14.1",
    "react-dom": "^16.3.2",
    "react-draft-wysiwyg": "^1.12.13",
    "react-komposer": "^1.13.1",
    "react-router": "^3.2.1",
    "react-tap-event-plugin": "^3.0.2",
    "simpl-schema": "^1.4.2",
    "subtitle": "^1.2.0"
  }

And this is what my .babelrc looks like:

{
  "presets": [
    ["@babel/preset-env", { "modules": false }],
    "@babel/preset-react",
    ["@babel/preset-stage-2", { "loose": true, "decoratorsLegacy": true }]
  ],
  "plugins": [
    "@babel/plugin-transform-runtime"
  ],
  "env": {
    "development": {
      "plugins": ["react-hot-loader/babel"]
    }
  }
}

Anyone have any ideas? Have tried all the usual babel packages re the legacy decorators, and not having much luck. Assist appreciated.

2

I just did a quick google, so sorry if you already tried this, but you can switch to the babel 7 version with:

meteor npm install @babel/plugin-proposal-decorators

and then in your .babelrc:

  "plugins": [
    ["@babel/plugin-proposal-decorators", { "legacy": true }],
  ]

And that should do it

Just a note that the other lines in your .babelrc are either redundant in Meteor or could actively cause issues. So Iā€™d clear out all the presets and plugin-transform-runtime as Meteor should take care of all of that for you

3 Likes