Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

React Native with GCanvas run error #40

Closed
Peterbald opened this issue May 20, 2018 · 2 comments
Closed

React Native with GCanvas run error #40

Peterbald opened this issue May 20, 2018 · 2 comments

Comments

@Peterbald
Copy link

Hi, I am developing a React Native app.

I run a demo with GCanvas in iOS device. I got a error was

failed to load bundle(http://localhost:8081/index.bundle?platform=ios&dev=true&minify=false) with error:(/Users/James/GCanvasDemo/node_modules/gcanvas.js/src/index.js: Unknown plugin "transform-decorators-legacy" specified in "/Users/James/GCanvasDemo/node_modules/gcanvas.js/.babelrc" at 2, attempted to resolve relative to "/Users/James/GCanvasDemo/node_modules/gcanvas.js" (null))

The project configration were following. How to make it work. Thanks a lot for your feedback.

Env information

    os: macOS High Sierra 10.13.2
    node: 9.9.0
    npm: 5.6.0
    watchman: 4.9.0
    react-native-cli: 2.0.1
    react-native: 0.55.4
    react-native-gcanvas : 0.0.7-dev
    gcanvas.js : 0.0.8

App.js

import React, { Component } from 'react';
import {
  Platform,
  StyleSheet,
  Text,
  View
} from 'react-native';

import {
  requireNativeComponent,
  findNodeHandle,
  NativeModules
} from 'react-native';


import {
  GCanvasView,
} from 'react-native-gcanvas';

import { enable, ReactNativeBridge, Image as GImage } from "gcanvas.js/src/index.js";

ReactNativeBridge.GCanvasModule = NativeModules.GCanvasModule;
ReactNativeBridge.Platform = Platform;

const instructions = Platform.select({
  ios: 'Press Cmd+R to reload,\n' +
    'Cmd+D or shake for dev menu',
  android: 'Double tap R on your keyboard to reload,\n' +
    'Shake or press menu button for dev menu',
});

type Props = {};
export default class App extends Component<Props> {
  render() {
    return (
      <View style={styles.container}>
        <Text style={styles.welcome}>
          Welcome to React Native!
        </Text>
        <Text style={styles.instructions}>
          To get started, edit App.js
        </Text>
        <Text style={styles.instructions}>
          {instructions}
        </Text>
      </View>
    );
  }
}

Package.json

    {
      "name": "GCanvasDemo",
      "version": "0.0.1",
      "private": true,
      "scripts": {
        "start": "node node_modules/react-native/local-cli/cli.js start",
        "test": "jest"
      },
      "dependencies": {
        "gcanvas.js": "0.0.8",
        "react": "16.3.1",
        "react-native": "0.55.4",
        "react-native-gcanvas": "0.0.7-dev"
      },
      "devDependencies": {
        "babel-jest": "22.4.4",
        "babel-preset-react-native": "4.0.0",
        "jest": "22.4.4",
        "react-test-renderer": "16.3.1"
      },
      "jest": {
        "preset": "react-native"
      }
    }

.babelrc

    {
      "presets": ["react-native"]
    }
@349989153
Copy link

try to add plugins in your .babelrc like:

{
  "presets": ["react-native"],
  "plugins": [
    "transform-decorators-legacy"
  ]
}

@Peterbald
Copy link
Author

@349989153 really appreciate your help.
GCanvas.js 0.0.8 has a .babelrc, so need install corresponding presets and plugins.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants