React-tools

react-tools 可以帮助React 将JSX在发布前编译成JS原生写法的.

安装:

npm -g install react-tools

G:\ProjectsPractice\React\react01>npm install -g react-tools
npm WARN deprecated react-tools@0.13.3: react-tools is deprecated. For more information, visit https://fb.me/react-tools-deprecated
D:\DevInstall\Nodejs\jsx -> D:\DevInstall\Nodejs\node_modules\react-tools\bin\jsx
D:\DevInstall\Nodejs
`-- react-tools@0.13.3
  +-- commoner@0.10.8
  | +-- commander@2.9.0
  | | `-- graceful-readlink@1.0.1
  | +-- detective@4.5.0
  | | +-- acorn@4.0.11
  | | `-- defined@1.0.0
  | +-- glob@5.0.15
  | | +-- inflight@1.0.6
  | | | `-- wrappy@1.0.2
  | | +-- inherits@2.0.3
  | | +-- minimatch@3.0.3
  | | | `-- brace-expansion@1.1.6
  | | |   +-- balanced-match@0.4.2
  | | |   `-- concat-map@0.0.1
  | | +-- once@1.4.0
  | | `-- path-is-absolute@1.0.1
  | +-- graceful-fs@4.1.11
  | +-- iconv-lite@0.4.15
  | +-- mkdirp@0.5.1
  | | `-- minimist@0.0.8
  | +-- private@0.1.7
  | +-- q@1.4.1
  | `-- recast@0.11.23
  |   +-- ast-types@0.9.6
  |   +-- esprima@3.1.3
  |   `-- source-map@0.5.6
  `-- jstransform@10.1.0
    +-- base62@0.1.1
    +-- esprima-fb@13001.1001.0-dev-harmony-fb
    `-- source-map@0.1.31
      `-- amdefine@1.0.1

安装完成后可以使用 jsx --help 查看帮助信息.

D:\React>jsx --help

  Usage: jsx [options] <source directory> <output directory> [<module ID> [<module ID> ...]]

  Options:

    -h, --help                               output usage information <帮助信息>
    -V, --version                            output the version number <版本号>
    -c, --config [file]                      JSON configuration file (no file or - means STDIN) 
                                             <如果是调用json文件配置，加-c>
    -w, --watch                              Continually rebuild <编译所有>
    -x, --extension <js | coffee | ...>      File extension to assume when resolving module                               identifiers < 解析指定标识符的文件 >
    --relativize                             Rewrite all module identifiers to be relative 
                                             < 重写所有模块标识符 >
    --follow-requires                        Scan modules for required dependencies < 扫描依赖模块 >
    --use-provides-module                    Respect @providesModules pragma in files 
                                             <不编译第三方模块语法>
    --cache-dir <directory>                  Alternate directory to use for disk cache 
                                             < 指定缓存目录 >
    --no-cache-dir                           Disable the disk cache  --source-charset <utf8 | win1252 | ...>  Charset of source (default: utf8) < 关闭缓存目录 >
    --output-charset <utf8 | win1252 | ...>  Charset of output (default: utf8)
                                             <输出的编码格式，默认是UTF-8>
    --harmony                                Turns on JS transformations such as ES6 Classes etc. < ?采用 ECMAScript 6 标准>
    --target [version]                       Specify your target version of ECMAScript. Valid values are "es3" and "es5". The default is "es5". "es3" will avoid uses of defineProperty and will quote reserved words. WARNING: "es5" is not properly supported, even with the use of es5shim, es5sham. If you need to support IE8, use "es3".
    --strip-types                            Strips out type annotations.< 删除注释 >
    --es6module                              Parses the file as a valid ES6 module. (Note that this means implicit strict mode) < ?不使用 ECMAScript 6 模块>
    --non-strict-es6module                   Parses the file as an ES6 module, except disables implicit strict-mode. (This is useful if you're porting non-ES6 modules to ES6, but haven't yet verified that they are strict-mode safe yet)
    --source-map-inline                      Embed inline sourcemap in transformed source <?>

编译命令

jsx –wacth 目标目录/ 编译后保存的目录/ –no-cache-dir

例如: jsx -watch src/ build/ 

转载于:https://my.oschina.net/shaw5/blog/861692