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

[easternbloc]

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.

[tvararu]

I did the exact same thing. :monkey:

[amasad]

ah, good point!

[DominicTobias]

This is weird, why couldn't the hyphens be removed and the thing kebab-cased where it needed to be? Even if I change the project name in package.json to use hyphens after creation then the upgrade command fails, but hyphen is a convention for package names on NPM.. such as react-native :D

[steve-gray]

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?

[ghost]

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.

[jasonmarziani]

react-native upgrade will fail if you change the project name from camelCase to kabob-case. So while you can run the project this way, you're stuck there without additional workarounds.