npm - '模块构建失败 : Error: Couldn't find preset "es2015" relative to directory' from newly created gatsby project

Question

我按照以下步骤创建了一个项目:

npm install -g gatsby
gatsby new dev-blog
cd dev-blog
npm install

然后我尝试从项目开始

gatsby develop --host localhost --port 9000

此时它抛出一个异常:

Failed to require /Users/antkong/wd/blogs/gatsby/dev-blog/html.js
./html.js
Module build failed: Error: Couldn't find preset "es2015" relative to directory "/Users/antkong/wd"

我该如何解决这个问题？

编辑

操作系统:OSX 10.12.4

Darwin mymac.local 16.5.0 Darwin Kernel Version 16.5.0: Fri Mar  3 16:52:33 PST 2017; root:xnu-3789.51.2~3/RELEASE_X86_64 x86_64

npm:3.10.10

节点:6.10.2

完整的堆栈跟踪:

❯❯ npm run develop   
> gatsby-starter-default@1.0.0 develop /Users/antkong/wd/blogs/gatsby/dev-blog
> gatsby develop

Failed to require /Users/antkong/wd/blogs/gatsby/dev-blog/html.js
./html.js
Module build failed: Error: Couldn't find preset "es2015" relative to directory "/Users/antkong/wd"
    at /Users/antkong/wd/blogs/gatsby/dev-blog/node_modules/babel-core/lib/transformation/file/options/option-manager.js:293:19
    at Array.map (native)
    at OptionManager.resolvePresets (/Users/antkong/wd/blogs/gatsby/dev-blog/node_modules/babel-core/lib/transformation/file/options/option-manager.js:275:20)
    at OptionManager.mergePresets (/Users/antkong/wd/blogs/gatsby/dev-blog/node_modules/babel-core/lib/transformation/file/options/option-manager.js:264:10)
    at OptionManager.mergeOptions (/Users/antkong/wd/blogs/gatsby/dev-blog/node_modules/babel-core/lib/transformation/file/options/option-manager.js:249:14)
    at OptionManager.init (/Users/antkong/wd/blogs/gatsby/dev-blog/node_modules/babel-core/lib/transformation/file/options/option-manager.js:368:12)
    at File.initOptions (/Users/antkong/wd/blogs/gatsby/dev-blog/node_modules/babel-core/lib/transformation/file/index.js:212:65)
    at new File (/Users/antkong/wd/blogs/gatsby/dev-blog/node_modules/babel-core/lib/transformation/file/index.js:135:24)
    at Pipeline.transform (/Users/antkong/wd/blogs/gatsby/dev-blog/node_modules/babel-core/lib/transformation/pipeline.js:46:16)
    at transpile (/Users/antkong/wd/blogs/gatsby/dev-blog/node_modules/babel-loader/lib/index.js:46:20)
    at /Users/antkong/wd/blogs/gatsby/dev-blog/node_modules/babel-loader/lib/fs-cache.js:79:18
    at ReadFileContext.callback (/Users/antkong/wd/blogs/gatsby/dev-blog/node_modules/babel-loader/lib/fs-cache.js:15:14)
    at FSReqWrap.readFileAfterOpen [as oncomplete] (fs.js:366:13)

 @ (webpack)-require/lib/webpackRequireEntrypoint.js 1:20-41

我也在用nvm

❯❯ nvm list                                                                      
->      v6.10.2
         system
default -> v6 (-> v6.10.2)
node -> stable (-> v6.10.2) (default)
stable -> 6.10 (-> v6.10.2) (default)
iojs -> N/A (default)
lts/* -> lts/boron (-> v6.10.2)
lts/argon -> v4.8.2 (-> N/A)
lts/boron -> v6.10.2

Answer 1

gabsty new 不会创建 babel 所需的 .babelrc。该错误是由于缺少.babelrc造成的。

这是我的 .babelrc 的内容:

{
  "presets": ["react", "es2015", "stage-0"],
  "env": {
    "development": {
      "presets": ["react-hmre"]
    }
  }
}