Wordpress 启动react项目时出错

我正在WordPress上构建一个React应用程序，但启动时遇到了问题

我稍微修改了package.json文件和webpack.config.js`并且在我的终端中得到了以下错误

➜  wp-api git:(development) ✗ npm start

> wp-api@1.0.0 start /Users/myuser/Projects/wp-api
> webpack-dev-server --open

Invalid configuration object. Webpack has been initialised using a configuration object that does not match the API schema.
 - configuration.resolve has an unknown property 'modulesDirectories'. These properties are valid:
   object { alias?, aliasFields?, cachePredicate?, descriptionFiles?, enforceExtension?, enforceModuleExtension?, extensions?, fileSystem?, mainFields?, mainFiles?, moduleExtensions?, modules?, plugins?, resolver?, symlinks?, unsafeCache?, useSyncFileSystemCalls? }
 - configuration.resolve.extensions[0] should not be empty.

npm ERR! Darwin 16.5.0
npm ERR! argv "/usr/local/Cellar/node/7.10.0/bin/node" "/usr/local/bin/npm" "start"
npm ERR! node v7.10.0
npm ERR! npm  v4.2.0
npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! wp-api@1.0.0 start: `webpack-dev-server --open`
npm ERR! Exit status 1
npm ERR! 
npm ERR! Failed at the wp-api@1.0.0 start script 'webpack-dev-server --open'.
npm ERR! Make sure you have the latest version of node.js and npm installed.
npm ERR! If you do, this is most likely a problem with the wp-api package,
npm ERR! not with npm itself.
npm ERR! Tell the author that this fails on your system:
npm ERR!     webpack-dev-server --open
npm ERR! You can get information on how to open an issue for this project with:
npm ERR!     npm bugs wp-api
npm ERR! Or if that isn't available, you can get their info via:
npm ERR!     npm owner ls wp-api
npm ERR! There is likely additional logging output above.

npm ERR! Please include the following file with any support request:
npm ERR!     /Users/myuser/.npm/_logs/2017-05-15T07_40_36_249Z-debug.log

日志文件是

0 info it worked if it ends with ok
1 verbose cli [ '/usr/local/Cellar/node/7.10.0/bin/node',
1 verbose cli   '/usr/local/bin/npm',
1 verbose cli   'start' ]
2 info using npm@4.2.0
3 info using node@v7.10.0
4 verbose run-script [ 'prestart', 'start', 'poststart' ]
5 info lifecycle wp-api@1.0.0~prestart: wp-api@1.0.0
6 silly lifecycle wp-api@1.0.0~prestart: no script for prestart, continuing
7 info lifecycle wp-api@1.0.0~start: wp-api@1.0.0
8 verbose lifecycle wp-api@1.0.0~start: unsafe-perm in lifecycle true
9 verbose lifecycle wp-api@1.0.0~start: PATH: /usr/local/lib/node_modules/npm/bin/node-gyp-bin:/Users/myuser/Projects/wp-api/node_modules/.bin:/Users/myuser/.rbenv/shims:/Users/myuser/.rbenv/bin:/usr/local/bin:/usr/bin:/bin:/usr/sbin:/sbin:/opt/X11/bin
10 verbose lifecycle wp-api@1.0.0~start: CWD: /Users/myuser/Projects/wp-api
11 silly lifecycle wp-api@1.0.0~start: Args: [ '-c', 'webpack-dev-server --open' ]
12 silly lifecycle wp-api@1.0.0~start: Returned: code: 1  signal: null
13 info lifecycle wp-api@1.0.0~start: Failed to exec start script
14 verbose stack Error: wp-api@1.0.0 start: `webpack-dev-server --open`
14 verbose stack Exit status 1
14 verbose stack     at EventEmitter.<anonymous> (/usr/local/lib/node_modules/npm/lib/utils/lifecycle.js:279:16)
14 verbose stack     at emitTwo (events.js:106:13)
14 verbose stack     at EventEmitter.emit (events.js:194:7)
14 verbose stack     at ChildProcess.<anonymous> (/usr/local/lib/node_modules/npm/lib/utils/spawn.js:40:14)
14 verbose stack     at emitTwo (events.js:106:13)
14 verbose stack     at ChildProcess.emit (events.js:194:7)
14 verbose stack     at maybeClose (internal/child_process.js:899:16)
14 verbose stack     at Process.ChildProcess._handle.onexit (internal/child_process.js:226:5)
15 verbose pkgid wp-api@1.0.0
16 verbose cwd /Users/myuser/Projects/wp-api
17 error Darwin 16.5.0
18 error argv "/usr/local/Cellar/node/7.10.0/bin/node" "/usr/local/bin/npm" "start"
19 error node v7.10.0
20 error npm  v4.2.0
21 error code ELIFECYCLE
22 error errno 1
23 error wp-api@1.0.0 start: `webpack-dev-server --open`
23 error Exit status 1
24 error Failed at the wp-api@1.0.0 start script 'webpack-dev-server --open'.
24 error Make sure you have the latest version of node.js and npm installed.
24 error If you do, this is most likely a problem with the wp-api package,
24 error not with npm itself.
24 error Tell the author that this fails on your system:
24 error     webpack-dev-server --open
24 error You can get information on how to open an issue for this project with:
24 error     npm bugs wp-api
24 error Or if that isn't available, you can get their info via:
24 error     npm owner ls wp-api
24 error There is likely additional logging output above.
25 verbose exit [ 1, true ]

及

我没有用webpack做过很多项目，所以我在这方面的知识非常有限

---

我做错了什么？我尝试删除node_modules文件夹并再次运行npm安装，但没有成功。

第一个问题的解决方案：

npm uninstall webpack --save-dev
npm install webpack@2.1.0-beta.22 --save-dev

解决问题

configuration.resolve.extensions[0]不应为空：

从阵列中删除

resolve: {
modulesDirectories: ['node_modules', 'src'], // Folders where Webpack is going to look for files to bundle together
extensions: ['.js'] // Extensions that Webpack is going to expect
},

或者将其替换为“*”

---

奇怪-它是否抱怨configuration.resolve.extensions[0]不应为空？我没有看到对此的抱怨，但是configuration.resolve有一个未知的属性“modulesDirectories”，webpack dev server是否必须全局安装？在您的情况下，不是。因为您运行npm，所以运行startgood决策。对于任何即将出现的错误，请首先检查软件包的兼容性

npm uninstall webpack --save-dev
npm install webpack@2.1.0-beta.22 --save-dev

resolve: {
modulesDirectories: ['node_modules', 'src'], // Folders where Webpack is going to look for files to bundle together
extensions: ['.js'] // Extensions that Webpack is going to expect
},

resolve: {
modulesDirectories: ['node_modules', 'src'], // Folders where Webpack is going to look for files to bundle together
extensions: ['*','.js'] // Extensions that Webpack is going to expect
},