React Native 打包.jsx文件

最近在研究React Native。感觉开发效率确实不错，但jsx语法写起来感觉不怎么顺手。

试用了Sublime Text 3和Visual Studio Code写代码，感觉反应总是慢一拍。

还是想换回VS2015写jsx,但用VS写jsx好像只能在后缀为.jsx的文件里面写。(不知道VS有没有直接设置在js里写jsx的方法)

于是翻了下react-native的打包程序，改了下让打包程序能自动打包.jsx文件。

贴出修改方法，习惯能VS的可以试着改下

1.项目主文件夹\node_modules\react-native\packager\react-packager\src\Server\index.js

找"var watchRootConfigs = opts.projectRoots.map(dir => {"这段，加上'.jsx'

var watchRootConfigs = opts.projectRoots.map(dir => {
return {
dir: dir,
globs: [
'**/*.js',
'**/*.json',
'**/*.jsx',
].concat(assetGlobs),
};
});

2.项目主文件夹\node_modules\react-native\packager\react-packager\src\DependencyResolver\DependencyGraph\index

0.22版使用的是node-haste在\node_modules\react-native\node_modules\node-haste\lib\index

找"this._crawling = crawl(allRoots, {"加段，同样加上'jsx'

this._crawling = crawl(allRoots, {
ignore: this._opts.ignoreFilePath,
exts: ['js', 'jsx','json'].concat(this._opts.assetExts),
fileWatcher: this._opts.fileWatcher,
});

3.项目主文件夹\node_modules\react-native\packager\react-packager\src\DependencyResolver\DependencyGraph\ResolutionRequest.js

0.22版在\node_modules\react-native\node_modules\node-haste\lib\DependencyGraph
找"if (this._fastfs.fileExists(potentialModulePath)) {"改成

      let file;
      let exts=["",
          this._platform?('.' + this._platform + '.js'):null,
          '.js',
          '.json',
          '.jsx'];
      for(let c=0;c<exts.length;c++){
        if(null!=exts[c]
              &&this._fastfs.fileExists(potentialModulePath + exts[c])
              &&(file = potentialModulePath + exts[c]))
            break;
      }
      if(!file){
        throw new UnableToResolveError(
          fromModule,
          toModule,
          `File ${potentialModulePath} doesnt exist`,
        );
      }
      //以下为原来的代码
      //if (this._fastfs.fileExists(potentialModulePath)) {
      //  file = potentialModulePath;
      //} else if (this._platform != null &&
      //           this._fastfs.fileExists(potentialModulePath + '.' + this._platform + '.js')) {
      //  file = potentialModulePath + '.' + this._platform + '.js';
      //} else if (this._fastfs.fileExists(potentialModulePath + '.js')) {
      //  file = potentialModulePath + '.js';
      //} else if (this._fastfs.fileExists(potentialModulePath + '.json')) {
      //  file = potentialModulePath + '.json';
      //} else {
      //  throw new UnableToResolveError(
      //    fromModule,
      //    toModule,
      //    `File ${potentialModulePath} doesnt exist`,
      //  );
      //}

　　

改成后再运行 react-native start就可以自动打包后缀为.jsx的文件了。