Unable to download JS bundle about react-native-material-design HOT 18 CLOSED

Hello

What version of React Native do you have, along with the device/Android API you're on?

Also could you show some code, and screenshot the error.

Cheers

from react-native-material-design.

My React Native version is 0.18.0-rc, device is Sony Xperia Z3 5.1.1 with API 22 and 23 installed. Code of my Component is:

import React, {AppRegistry, StyleSheet, Text, View, ListView, Image, TouchableOpacity} from 'react-native'
import { Actions } from 'react-native-router-flux'
import { Avatar } from 'react-native-material-design'

const Flights = React.createClass({
  getInitialState: function() {
    let ds = new ListView.DataSource({rowHasChanged: (r1, r2) => r1 !== r2});
    return {
      flights: ds.cloneWithRows([]),
    };
  },

  componentDidMount: function() {
    this.fetchData();
  },

  fetchData: function() {
    fetch('data_fetch_link')
      .then((response) => response.json())
      .then((responseData) => {
        let ds = new ListView.DataSource({rowHasChanged: (r1, r2) => r1 !== r2});
        this.setState({
          flights: ds.cloneWithRows(responseData),
        });
      })
      .done();
  },

  render: function() {
    let flights = this.state.flights;

    return (
      <View style={styles.container}>
        <ListView
            dataSource={this.state.flights}
            renderRow={(rowData) =>
              <TouchableOpacity onPress={()=>Actions.Flight({flight: rowData})}>
                <View style={styles.card}>
                  <Text>{rowData.uuid}</Text>
                </View>
              </TouchableOpacity>
            }
        />
      </View>
    );
  }
});

const styles = StyleSheet.create({
  container: {
    flex: 1,
  },
  card: {
    height: 80,
    borderStyle: 'solid',
    borderBottomWidth: 1,
    borderBottomColor: '#666666',
  },
  image: {
    width: 60,
    height: 80,
  }
});

module.exports = Flights;

from react-native-material-design.

Hmm. I did think it might be cause it's in ES5. Can you try with 0.17 and see if it works? I'll test when I can.

from react-native-material-design.

Also, @NoWay1201 can you show the full error please so we can investigate further.

from react-native-material-design.

@Ehesp when running with 0.17 i got following error:
"node_modules/react-native-material-design/lib/polyfill/Ripple.js: A semicolon is required after a class property (42:5)". When I'm adding the semicolon, got this:
"'ScrollView' has no propType for native prop RCTScrollView.sendMomentumEvents' of native type 'boolean'".

@Salakar here you are:
Phone:

And packager: (it is stucked like that)

from react-native-material-design.

@NoWay1201 I don't think it's properly downgraded from 0.18-rc - see facebook/react-native#5191 seems to be related. Did you try it again by downgrading or fresh-install with 0.17?

from react-native-material-design.

@Ehesp I tried to downgrade it to 0.17 again, and still the same error: "A semicolon is required after a class property". My global react-native is 0.1.7 and in package.json I have "react-native": "0.17.0" and when running npm install after rm-rf node_modules it shows me that it's downloading reac-tnative 0.17, so it should be good, or maybe I'm wrong? I simplified my file:

'use strict';

import React, {AppRegistry, StyleSheet, Text, View, ListView, Image, TouchableOpacity} from 'react-native'
import { Actions } from 'react-native-router-flux'
import { Avatar } from 'react-native-material-design'

const Flights = React.createClass({
  render: function() {
    return (
      <Text>Test</Text>
    )
  }
});

module.exports = Flights;

And without import it's working, but with "A semicolon is required after a class poperty".

from react-native-material-design.

Could I see your android/app/build.gradle file too please?
On 8 Jan 2016 07:36, "kkdjfjejejqk" [email protected] wrote:

@Ehesp https://github.com/Ehesp I tried to downgrade it to 0.17 again,
and still the same error: "A semicolon is required after a class property".
My global react-native is 0.1.7 and in package.json I have "react-native":
"0.17.0" and when running npm install after rm-rf node_modules it shows me
that it's downloading reac-tnative 0.17, so it should be good, or maybe I'm
wrong? I simplified my file:

'use strict';

import React, {AppRegistry, StyleSheet, Text, View, ListView, Image, TouchableOpacity} from 'react-native'
import { Actions } from 'react-native-router-flux'
import { Avatar } from 'react-native-material-design'

const Flights = React.createClass({
render: function() {
return (
Test
)
}
});

module.exports = Flights;

And without import it's working, but with "A semicolon is required after a
class poperty".

—
Reply to this email directly or view it on GitHub
#15 (comment)
.

from react-native-material-design.

Sure:

apply plugin: "com.android.application"

/**
 * The react.gradle file registers two tasks: bundleDebugJsAndAssets and bundleReleaseJsAndAssets.
 * These basically call `react-native bundle` with the correct arguments during the Android build
 * cycle. By default, bundleDebugJsAndAssets is skipped, as in debug/dev mode we prefer to load the
 * bundle directly from the development server. Below you can see all the possible configurations
 * and their defaults. If you decide to add a configuration block, make sure to add it before the
 * `apply from: "react.gradle"` line.
 *
 * project.ext.react = [
 *   // the name of the generated asset file containing your JS bundle
 *   bundleAssetName: "index.android.bundle",
 *
 *   // the entry file for bundle generation
 *   entryFile: "index.android.js",
 *
 *   // whether to bundle JS and assets in debug mode
 *   bundleInDebug: false,
 *
 *   // whether to bundle JS and assets in release mode
 *   bundleInRelease: true,
 *
 *   // the root of your project, i.e. where "package.json" lives
 *   root: "../../",
 *
 *   // where to put the JS bundle asset in debug mode
 *   jsBundleDirDebug: "$buildDir/intermediates/assets/debug",
 *
 *   // where to put the JS bundle asset in release mode
 *   jsBundleDirRelease: "$buildDir/intermediates/assets/release",
 *
 *   // where to put drawable resources / React Native assets, e.g. the ones you use via
 *   // require('./image.png')), in debug mode
 *   resourcesDirDebug: "$buildDir/intermediates/res/merged/debug",
 *
 *   // where to put drawable resources / React Native assets, e.g. the ones you use via
 *   // require('./image.png')), in release mode
 *   resourcesDirRelease: "$buildDir/intermediates/res/merged/release",
 *
 *   // by default the gradle tasks are skipped if none of the JS files or assets change; this means
 *   // that we don't look at files in android/ or ios/ to determine whether the tasks are up to
 *   // date; if you have any other folders that you want to ignore for performance reasons (gradle
 *   // indexes the entire tree), add them here. Alternatively, if you have JS files in android/
 *   // for example, you might want to remove it from here.
 *   inputExcludes: ["android/**", "ios/**"]
 * ]
 */

apply from: "react.gradle"

android {
    compileSdkVersion 23
    buildToolsVersion "23.0.1"

    defaultConfig {
        applicationId "com.xcp4_flights_new"
        minSdkVersion 16
        targetSdkVersion 22
        versionCode 1
        versionName "1.0"
        ndk {
            abiFilters "armeabi-v7a", "x86"
        }
    }
    buildTypes {
        release {
            minifyEnabled false  // Set this to true to enable Proguard
            proguardFiles getDefaultProguardFile("proguard-android.txt"), "proguard-rules.pro"
        }
    }
}

dependencies {
    compile fileTree(dir: "libs", include: ["*.jar"])
    compile "com.android.support:appcompat-v7:23.0.1"
    compile "com.facebook.react:react-native:0.18.+"
}

I can say, that when i added this 3 semicolons, it started working

from react-native-material-design.

Very bottom, you're still running the app on 18:

compile "com.facebook.react:react-native:0.18.+"

Change that back and try to reinstall. I'm pretty confident it's an 0.18
issue, seen a few issues about this but it should be fixed for official
release.
On 8 Jan 2016 07:41, "kkdjfjejejqk" [email protected] wrote:

Sure:

apply plugin: "com.android.application"

/**

• The react.gradle file registers two tasks: bundleDebugJsAndAssets and bundleReleaseJsAndAssets.
• These basically call react-native bundle with the correct arguments during the Android build
• cycle. By default, bundleDebugJsAndAssets is skipped, as in debug/dev mode we prefer to load the
• bundle directly from the development server. Below you can see all the possible configurations
• and their defaults. If you decide to add a configuration block, make sure to add it before the
• apply from: "react.gradle" line.
  *
• project.ext.react = [
• // the name of the generated asset file containing your JS bundle
• bundleAssetName: "index.android.bundle",

• // the entry file for bundle generation
• entryFile: "index.android.js",

• // whether to bundle JS and assets in debug mode
• bundleInDebug: false,

• // whether to bundle JS and assets in release mode
• bundleInRelease: true,

• // the root of your project, i.e. where "package.json" lives
• root: "../../",

• // where to put the JS bundle asset in debug mode
• jsBundleDirDebug: "$buildDir/intermediates/assets/debug",

• // where to put the JS bundle asset in release mode
• jsBundleDirRelease: "$buildDir/intermediates/assets/release",

• // where to put drawable resources / React Native assets, e.g. the ones you use via
• // require('./image.png')), in debug mode
• resourcesDirDebug: "$buildDir/intermediates/res/merged/debug",

• // where to put drawable resources / React Native assets, e.g. the ones you use via
• // require('./image.png')), in release mode
• resourcesDirRelease: "$buildDir/intermediates/res/merged/release",

• // by default the gradle tasks are skipped if none of the JS files or assets change; this means
• // that we don't look at files in android/ or ios/ to determine whether the tasks are up to
• // date; if you have any other folders that you want to ignore for performance reasons (gradle
• // indexes the entire tree), add them here. Alternatively, if you have JS files in android/
• // for example, you might want to remove it from here.
• inputExcludes: ["android/", "ios/"]
• ]
  */

apply from: "react.gradle"

android {
compileSdkVersion 23
buildToolsVersion "23.0.1"

defaultConfig {
    applicationId "com.xcp4_flights_new"
    minSdkVersion 16
    targetSdkVersion 22
    versionCode 1
    versionName "1.0"
    ndk {
        abiFilters "armeabi-v7a", "x86"
    }
}
buildTypes {
    release {
        minifyEnabled false  // Set this to true to enable Proguard
        proguardFiles getDefaultProguardFile("proguard-android.txt"), "proguard-rules.pro"
    }
}

}

dependencies {
compile fileTree(dir: "libs", include: ["*.jar"])
compile "com.android.support:appcompat-v7:23.0.1"
compile "com.facebook.react:react-native:0.18.+"
}

I can say, that when i added this 3 semicolons, it started working

—
Reply to this email directly or view it on GitHub
#15 (comment)
.

from react-native-material-design.

When I'm setting it to
compile "com.facebook.react:react-native:0.17.0"
got this in console when trying to react-native run-android:

:app:generateDebugSources
:app:processDebugJavaRes UP-TO-DATE
:app:compileDebugJavaWithJavac
/home/noway/xcp4_flights_new/android/app/src/main/java/com/xcp4_flights_new/MainActivity.java:3: error: cannot find symbol
import com.facebook.react.ReactActivity;
                         ^
  symbol:   class ReactActivity
  location: package com.facebook.react
/home/noway/xcp4_flights_new/android/app/src/main/java/com/xcp4_flights_new/MainActivity.java:10: error: cannot find symbol
public class MainActivity extends ReactActivity {
                                  ^
  symbol: class ReactActivity
/home/noway/xcp4_flights_new/android/app/src/main/java/com/xcp4_flights_new/MainActivity.java:16: error: method does not override or implement a method from a supertype
    @Override
    ^
/home/noway/xcp4_flights_new/android/app/src/main/java/com/xcp4_flights_new/MainActivity.java:25: error: method does not override or implement a method from a supertype
    @Override
    ^
/home/noway/xcp4_flights_new/android/app/src/main/java/com/xcp4_flights_new/MainActivity.java:34: error: method does not override or implement a method from a supertype
    @Override
    ^
5 errors
:app:compileDebugJavaWithJavac FAILED

FAILURE: Build failed with an exception.

* What went wrong:
Execution failed for task ':app:compileDebugJavaWithJavac'.
> Compilation failed; see the compiler error output for details.

* Try:
Run with --stacktrace option to get the stack trace. Run with --info or --debug option to get more log output.

BUILD FAILED

Total time: 6.064 secs
Could not install the app on the device, read the error above for details.
Make sure you have an Android emulator running or a device connected and have
set up your Android development environment:
https://facebook.github.io/react-native/docs/android-setup.html

from react-native-material-design.

Can you come onto Gitter? Can help out better there https://gitter.im/react-native-material-design/react-native-material-design

from react-native-material-design.

@Ehesp @NoWay1201 I've just made a PR to fix this.

from react-native-material-design.

@Ehesp @zoontek @NoWay1201 fix has been published to npm. Thanks again @zoontek .

from react-native-material-design.

Closing as issue resolved. Re-open if you have anymore related issues. Thanks!

from react-native-material-design.

Currently this repo doesn't work on RN 0.18/0.18.1, right?
I got same error running on device: "'ScrollView' has no propType for native prop RCTScrollView.sendMomentumEvents' of native type 'boolean'". But no error on genymotion.

Also it's work if I downgrade to 0.17 :/
But I need 0.18 very much because it can split build per architecture so the APK size is much smaller.

Edit:

• tested on two Android 4.4.2 devices: Xiaomi Redmi Note 3G & Acer phone (I don't know this series because it's not mine)

from react-native-material-design.

I'll look into this, I'm pretty sure that the demo app is running on 18.
Any particular component?
On 29 Jan 2016 03:42, "Pewh Gosh" [email protected] wrote:

Currently this repo doesn't work on RN 0.18/0.18.1, right?
I got same error running on device: "'ScrollView' has no propType for
native prop RCTScrollView.sendMomentumEvents' of native type 'boolean'".
But no error on genymotion.

Also it's work if I downgrade to 0.17 :/
But I need 0.18 very much because it can split build per architecture so
the APK size is much smaller

—
Reply to this email directly or view it on GitHub
#15 (comment)
.

from react-native-material-design.

Oops. It's my bad. I've fix my problem by deleting file app/src/main/assets/index.android.bundle which cause the error on RN 0.18. So it's not an issue on your repo.

from react-native-material-design.