“npm 运行构建"因语法错误而失败:意外的令牌 [英] "npm run build" fails with SyntaxError:Unexpected token
问题描述
我正在尝试将我的应用程序部署到 AWS，但在执行npm run build"时遇到错误.此错误似乎与 webpack.config.js 相关，但我不知道，因为我没有对该文件进行任何修改.
我在这里发现了一个类似的问题，但它并没有多大帮助.语法错误:createScript 处的无效或意外令牌 (vm.js:80:10)
<错误日志>/var/www/gamestocker/app/GameStocker/react_view/node_modules/react-scripts/config/webpack.config.js:306...(isEnvProductionProfile && {^^^语法错误:意外的令牌...在 createScript (vm.js:56:10)在 Object.runInThisContext (vm.js:97:10)在 Module._compile (module.js:549:28)在 Object.Module._extensions..js (module.js:586:10)在 Module.load (module.js:494:32)在 tryModuleLoad (module.js:453:12)在 Function.Module._load (module.js:445:3)在 Module.require (module.js:504:17)在要求(内部/module.js:20:19)在对象<匿名>(/var/www/gamestocker/app/GameStocker/react_view/node_modules/react-scripts/scripts/build.js:38:23)npm 错误！Linux 4.14.173-137.229.amzn2.x86_64npm 错误！argv "/usr/bin/node" "/usr/bin/npm" "运行" "构建"npm 错误！节点 v6.17.1npm 错误！npm v3.10.10npm 错误！代码生命周期npm 错误！gamestocker@0.1.0 构建:`反应脚本构建`npm 错误！退出状态 1npm 错误！npm 错误！在 gamestocker@0.1.0 构建脚本react-scripts build"失败.npm 错误！确保您安装了最新版本的 node.js 和 npm.npm 错误！如果你这样做，这很可能是 gamestocker 包的问题，npm 错误！不是 npm 本身.npm 错误！告诉作者这在您的系统上失败:npm 错误！反应脚本构建npm 错误！您可以通过以下方式获取有关如何为此项目打开问题的信息:npm 错误！npm 错误 gamestockernpm 错误！或者，如果这不可用，您可以通过以下方式获取他们的信息:npm 错误！npm 所有者 ls gamestockernpm 错误！上面可能有额外的日志输出.npm 错误！请在任何支持请求中包含以下文件:npm 错误！/var/www/gamestocker/app/GameStocker/react_view/npm-debug.log以下是错误日志中提到的 webpack.config.js 部分.或者可能在 vm.js 文件中
...别名:{//支持 React Native Web//https://www.smashingmagazine.com/2016/08/a-glimpse-into-the-future-with-react-native-for-web/'react-native': 'react-native-web',//允许使用 ReactDevTools 进行更好的分析...(isEnvProductionProfile && {'react-dom$': 'react-dom/分析',调度程序/跟踪":调度程序/跟踪分析"，}),...(modules.webpackAliases || {}),},... 如果您能提供任何建议或可能的原因，我将不胜感激.谢谢:)
)
I am trying to deploy my app to AWS and encountered an error when executing "npm run build". This error seems to be relevant with webpack.config.js, but I have no idea since I haven't modified anything to that file.
I found a similar question here but it did not help that much. SyntaxError: Invalid or unexpected token at createScript (vm.js:80:10)
<error log>
/var/www/gamestocker/app/GameStocker/react_view/node_modules/react-scripts/config/webpack.config.js:306
...(isEnvProductionProfile && {
^^^
SyntaxError: Unexpected token ...
at createScript (vm.js:56:10)
at Object.runInThisContext (vm.js:97:10)
at Module._compile (module.js:549:28)
at Object.Module._extensions..js (module.js:586:10)
at Module.load (module.js:494:32)
at tryModuleLoad (module.js:453:12)
at Function.Module._load (module.js:445:3)
at Module.require (module.js:504:17)
at require (internal/module.js:20:19)
at Object.<anonymous> (/var/www/gamestocker/app/GameStocker/react_view/node_modules/react-scripts/scripts/build.js:38:23)
npm ERR! Linux 4.14.173-137.229.amzn2.x86_64
npm ERR! argv "/usr/bin/node" "/usr/bin/npm" "run" "build"
npm ERR! node v6.17.1
npm ERR! npm v3.10.10
npm ERR! code ELIFECYCLE
npm ERR! gamestocker@0.1.0 build: `react-scripts build`
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the gamestocker@0.1.0 build script 'react-scripts build'.
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 gamestocker package,
npm ERR! not with npm itself.
npm ERR! Tell the author that this fails on your system:
npm ERR! react-scripts build
npm ERR! You can get information on how to open an issue for this project with:
npm ERR! npm bugs gamestocker
npm ERR! Or if that isn't available, you can get their info via:
npm ERR! npm owner ls gamestocker
npm ERR! There is likely additional logging output above.
npm ERR! Please include the following file with any support request:
npm ERR! /var/www/gamestocker/app/GameStocker/react_view/npm-debug.log
Below is the part of webpack.config.js that the error log mentions. or may be in vm.js file
<webpack.config.js>
.
.
.
alias: {
// Support React Native Web
// https://www.smashingmagazine.com/2016/08/a-glimpse-into-the-future-with-react-native-for-web/
'react-native': 'react-native-web',
// Allows for better profiling with ReactDevTools
...(isEnvProductionProfile && {
'react-dom$': 'react-dom/profiling',
'scheduler/tracing': 'scheduler/tracing-profiling',
}),
...(modules.webpackAliases || {}),
},
.
.
.
I would appreciate it if you could provide any suggestion or possible reasons. Thanks :)
[EDITED
<vm.js>
var test = require('tape');
var vm = require('../');
test('vmRunInNewContext', function (t) {
t.plan(6);
t.equal(vm.runInNewContext('a + 5', { a : 100 }), 105);
(function () {
var vars = { x : 10 };
t.equal(vm.runInNewContext('x++', vars), 10);
t.equal(vars.x, 11);
})();
(function () {
var vars = { x : 10 };
t.equal(vm.runInNewContext('var y = 3; y + x++', vars), 13);
t.equal(vars.x, 11);
t.equal(vars.y, 3);
})();
t.end();
});
test('vmRunInContext', function (t) {
t.plan(2);
var context = vm.createContext({ foo: 1 });
vm.runInContext('var x = 1', context);
t.deepEqual(context, { foo: 1, x: 1 });
vm.runInContext('var y = 1', context);
t.deepEqual(context, { foo: 1, x: 1, y: 1 });
});
It sounds like the code is being run with a slightly older JavaScript engine, from before spread properties were added in ES2018. (Spread for iterables was added in ES2015, but property spread was only added in ES2018.)
If you can't upgrade the environment to something more recent, you can switch to Object.assign:
alias: Object.assign(
{
// Support React Native Web
// https://www.smashingmagazine.com/2016/08/a-glimpse-into-the-future-with-react-native-for-web/
'react-native': 'react-native-web'
},
// Allows for better profiling with ReactDevTools
isEnvProductionProfile && {
'react-dom$': 'react-dom/profiling',
'scheduler/tracing': 'scheduler/tracing-profiling',
},
modules.webpackAliases || {}
),
Object.assign was added in ES2015.
Side note: You can replace
modules.webpackAliases || {}
with just
modules.webpackAliases || {}
above. Object.assign (and property spread) effectively ignore it if you pass them a falsy value instead of an object. (It's not literally true, they only explicitly ignore null and undefined; all others are converted to the equivalent object and then their enumerable own properties are used — but the objects that false, 0, NaN, and "" are converted to don't have any enumerable own properties. Just don't pass document.all to it, which is falsy but does have enumerable own properties... [Yes, document.all is really falsy. I cover that bizarre historical artefact in Chapter 17 of my book JavaScript: The New Toys.])
这篇关于“npm 运行构建"因语法错误而失败:意外的令牌的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
