深入react技术栈-源码问题1

问题1 深入react技术栈源码第一次运行时报错--'NODE_ENV' 不是内部或外部命令，也不是可运行的程序或批处理文件。

在运行第二章的代码时，执行npm install 后运行代码时，报 ‘NODE_ENV’ 不是内部或外部命令，也不是可运行的程序或批处理文件。

解决方法

找到 package.json 文件 修改scripts其中的内容：

"scripts": {
    "start": "set NODE_ENV=dev && node ./server.js"
},

问题2

ERROR in ./js/Tabs.js
Module build failed: SyntaxError: F:/react/react-book-examples-master/02/js/Tabs.js: Decorators are not officially supported yet in 6.x pending a proposal update.
However, if you need to use them you can install the legacy decorators transform with:

npm install babel-plugin-transform-decorators-legacy --save-dev

and add the following line to your .babelrc file:

{
  "plugins": ["transform-decorators-legacy"]
}

The repo url is: https://github.com/loganfsmyth/babel-plugin-transform-decorators-legacy.

解决方法

这个问题是babel的版本问题，在高版本的babel中阻止实施装饰，需要我们添加一个特殊的插件 babel-plugin-transform-decorators-legacy

npm i --save-dev babel-plugin-transform-decorators-legacy

然后修改 .babelrc

{
  "presets": ["es2015", "stage-0", "react"],
  "plugins": [
    ["transform-decorators-legacy"],
    // ...
  ]
}

或者 Webpack

{
  test: /\.jsx?$/,
  loader: 'babel',
  query: {
    cacheDirectory: true,
    plugins: ['transform-decorators-legacy' ],
    presets: ['es2015', 'stage-0', 'react']
  }
}

参考链接

Webpack babel 6 ES6装饰

React.js 6.x正在等待提案更新中还不支持装饰器