question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

[0.56.0-rc-2] Decorator support broken

See original GitHub issue

Environment

Run react-native info in your terminal and paste its contents here.

React Native Environment Info:
    System:
      OS: macOS High Sierra 10.13.4
      CPU: x64 Intel(R) Core(TM) i7-7820HQ CPU @ 2.90GHz
      Memory: 148.02 MB / 16.00 GB
      Shell: 5.3 - /bin/zsh
    Binaries:
      Node: 8.11.2 - /usr/local/bin/node
      Yarn: 1.6.0 - /usr/local/bin/yarn
      npm: 6.1.0 - /usr/local/bin/npm
      Watchman: 4.9.0 - /usr/local/bin/watchman
    SDKs:
      iOS SDK:
        Platforms: iOS 11.3, macOS 10.13, tvOS 11.3, watchOS 4.3
    IDEs:
      Android Studio: 3.0 AI-171.4443003
      Xcode: 9.3.1/9E501 - /usr/bin/xcodebuild
    npmPackages:
      react: ^16.3.2 => 16.4.1
      react-native: ^0.56.0-rc.2 => 0.56.0-rc.2
    npmGlobalPackages:
      eslint-plugin-react-native: 3.2.1
      react-native-cli: 2.0.1
      react-native-git-upgrade: 0.2.7

Description

After upgrading to RN56, I am receiving a red screen for error:(...node-modules/react-native-Libraries/react-native/react-native-implementation.js: Cannot find module 'react-native-stage-0/decorator-support'.... My .babelrc file is as follows and worked on previous versions:

{
  "presets": [
  	"react-native",
  	"react-native-stage-0/decorator-support"
  ],
  "plugins": [
    "transform-decorators-legacy"
  ],
  "sourceMaps": true
}

Dev deps in package.json

  "devDependencies": {
    "babel-eslint": "^8.2.3",
    "babel-jest": "21.2.0",
    "babel-preset-react-native": "5.0.2",
    "babel-preset-react-native-stage-0": "^1.0.1",
    "eslint": "^4.19.1",
    "eslint-plugin-eslint-comments": "^2.0.2",
    "eslint-plugin-flowtype": "^2.49.3",
    "eslint-plugin-jest": "^21.17.0",
    "eslint-plugin-prettier": "^2.6.0",
    "eslint-plugin-react-native": "^3.2.1",
    "jest": "21.2.1",
    "react-test-renderer": "^16.4.1"
  },

Reproducible Demo

Use provided .babelrc on a 0.56.0-rc2 project

react-native init example --version="0.56.0-rc.2"
cd ./example
yarn add --dev babel-preset-react-native-stage-0

Issue Analytics

  • State:closed
  • Created 5 years ago
  • Comments:5 (2 by maintainers)

github_iconTop GitHub Comments

18reactions
jshearercommented, Jun 18, 2018

I solved this by using

"babel-plugin-transform-decorators-legacy": "^1.3.5",

and

"plugins": [
    "transform-decorators-legacy",
]

In my .babelrc file.

5reactions
fwh1990commented, Jun 21, 2018

@jshearer

No, you should install @babel/plugin-proposal-decorators for babel 7. The plugin you use was for babel 6

And babel had change it’s package prefix to @babel since babel-7-beta.4. You can see babel github here

Read more comments on GitHub >

github_iconTop Results From Across the Web

Release Notes — Numba 0.56.4+0.g288a38bbd.dirty-py3.7 ...
This is a bugfix release that supports NumPy 1.23 and fixes CUDA function caching. Pull-Requests: PR #8239: Add decorator to run a test...
Read more >
Documentation - Decorators - TypeScript
A Decorator is a special kind of declaration that can be attached to a class declaration, method, accessor, property, or parameter. Decorators use...
Read more >
How To Use Decorators in TypeScript - DigitalOcean
One of those extra features is decorator support. Decorators are a way to decorate members of a class, or a class itself, ...
Read more >
JavaScript Decorators: What They Are and When to Use Them
In Angular, decorators are available thanks to TypeScript, but in JavaScript ... The decorator proposal adds support for class and property ...
Read more >
Understanding JavaScript decorators - LogRocket Blog
Learn about JavaScript's function decorators and class decorators as ... and include information about the latest breaking changes to Babel.
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found