If you name your app with hyphens react-native will create a broken project by default

If you do something like:

react-native init my-native-app

React will create a project scaffold for you but the resulting javascript file will fail to load.

So you will get something like:

var my-native-app = React.createClass({

In your index.ios.js file.

Not a huge problem but it should probably remove hyphens the hyphens non the less.

3 thoughts on “If you name your app with hyphens react-native will create a broken project by default

  1. I’m very inclined to agree with @DominicTobias on this one – it’s very frustrating to have just the react-native projects named inconsistently to the rest of an NPM package set and runs contrary to the norms of the ecosystem.

    @amasad: Is there any scope to re-open this issue or has the react-native team decided that this is a matter of policy/won’t fix? I’m happy to knock together a PR for this, as there’s only a finite number of places this occurs. What I’d propose to do is:

    • Anywhere the project name is used for a native type (i.e. Java classes, etc), swap the project name raw variable for a camel-cased version that splits on any non-alphanumeric, non-underscore character. This meets the common coding conventions of the various platform native toolsets.
    • Amend the validation code from commit 5ce9ab1 so that it allows the hyphen in the name.

    Can do this sometime this week?

  2. Here’s a workaround that I’ve tried and tested.

    1. react-native init projectNameHere
    2. rename projectNameHere directory to project-name-here
    3. change name in package.json to project-name-here
    4. react-native run-android still works.

    If I’m missing a reason this won’t work, please do let me know.

Comments are closed.

If you name your app with hyphens react-native will create a broken project by default

If you do something like:

react-native init my-native-app

React will create a project scaffold for you but the resulting javascript file will fail to load.

So you will get something like:

var my-native-app = React.createClass({

In your index.ios.js file.

Not a huge problem but it should probably remove hyphens the hyphens non the less.

2 thoughts on “If you name your app with hyphens react-native will create a broken project by default

  1. I’m very inclined to agree with @DominicTobias on this one – it’s very frustrating to have just the react-native projects named inconsistently to the rest of an NPM package set and runs contrary to the norms of the ecosystem.

    @amasad: Is there any scope to re-open this issue or has the react-native team decided that this is a matter of policy/won’t fix? I’m happy to knock together a PR for this, as there’s only a finite number of places this occurs. What I’d propose to do is:

    • Anywhere the project name is used for a native type (i.e. Java classes, etc), swap the project name raw variable for a camel-cased version that splits on any non-alphanumeric, non-underscore character. This meets the common coding conventions of the various platform native toolsets.
    • Amend the validation code from commit 5ce9ab1 so that it allows the hyphen in the name.

    Can do this sometime this week?

  2. Here’s a workaround that I’ve tried and tested.

    1. react-native init projectNameHere
    2. rename projectNameHere directory to project-name-here
    3. change name in package.json to project-name-here
    4. react-native run-android still works.

    If I’m missing a reason this won’t work, please do let me know.

Comments are closed.