React JS Error "...rest" Syntax error: Unexpected token
React JS Error "...rest" Syntax error: Unexpected token
我是 React 的新手,正在看这个 ReactTraining。我想将我的一些路径设为私有(这样你只能在登录时查看它们)。我能够很好地验证用户并将他们定向到一个新页面,但现在我想 "Protect" 该页面,以便它只能在登录后访问。我发现了一些不同的 sources使用下面相同的 "PrivateRoute" 函数。到目前为止一切似乎都很好(并且有意义),除了以下代码的“...rest”部分:
const PrivateRoute = ({ component: Component, ...rest }) => (
<Route {...rest} render={props => (
fakeAuth.isAuthenticated ? (
<Component {...props}/>
) : (
<Redirect to={{
pathname: '/login',
state: { from: props.location }
}}/>
)
)}/>
)
我收到以下错误:
Uncaught Error: Cannot find module "./components/Login"
at webpackMissingModule (router.js:9)
at Object.<anonymous> (router.js:9)
at __webpack_require__ (bootstrap 18b9132…:555)
at fn (bootstrap 18b9132…:86)
at Object.<anonymous> (index.js:22)
at __webpack_require__ (bootstrap 18b9132…:555)
at fn (bootstrap 18b9132…:86)
at Object.<anonymous> (bootstrap 18b9132…:578)
at __webpack_require__ (bootstrap 18b9132…:555)
at bootstrap 18b9132…:578
webpackMissingModule @ router.js:9
(anonymous) @ router.js:9
__webpack_require__ @ bootstrap 18b9132…:555
fn @ bootstrap 18b9132…:86
(anonymous) @ index.js:22
__webpack_require__ @ bootstrap 18b9132…:555
fn @ bootstrap 18b9132…:86
(anonymous) @ bootstrap 18b9132…:578
__webpack_require__ @ bootstrap 18b9132…:555
(anonymous) @ bootstrap 18b9132…:578
(anonymous) @ bootstrap 18b9132…:578
webpackHotDevClient.js:233 Error in ./src/components/Login.js
Syntax error: Unexpected token (16:46)
14 |
15 |
> 16 | const PrivateRoute = ({ component: Component, ...rest }) => (
| ^
17 | <Route {...rest} render={props => (
18 | fakeAuth.isAuthenticated ? (
19 | <Component {...props}/>
@ ./src/router.js 25:13-42
看来我正在导入我应该安装的所有东西,所以我的想法是我没有安装应该安装的东西。
有谁知道我可能需要安装什么才能解决此错误?
spread ...
syntax 不是 es2015
或 react
babel 预设的一部分。目前是第 3 阶段提案。要在 React 项目中启用对传播的支持,请安装 babel stage 3 插件:
npm install --save-dev babel-preset-stage-3
并将其添加到您的 .babelrc
:
{
"presets": [
"es2015",
"react",
"stage-3"
]
}
我是 React 的新手,正在看这个 ReactTraining。我想将我的一些路径设为私有(这样你只能在登录时查看它们)。我能够很好地验证用户并将他们定向到一个新页面,但现在我想 "Protect" 该页面,以便它只能在登录后访问。我发现了一些不同的 sources使用下面相同的 "PrivateRoute" 函数。到目前为止一切似乎都很好(并且有意义),除了以下代码的“...rest”部分:
const PrivateRoute = ({ component: Component, ...rest }) => (
<Route {...rest} render={props => (
fakeAuth.isAuthenticated ? (
<Component {...props}/>
) : (
<Redirect to={{
pathname: '/login',
state: { from: props.location }
}}/>
)
)}/>
)
我收到以下错误:
Uncaught Error: Cannot find module "./components/Login"
at webpackMissingModule (router.js:9)
at Object.<anonymous> (router.js:9)
at __webpack_require__ (bootstrap 18b9132…:555)
at fn (bootstrap 18b9132…:86)
at Object.<anonymous> (index.js:22)
at __webpack_require__ (bootstrap 18b9132…:555)
at fn (bootstrap 18b9132…:86)
at Object.<anonymous> (bootstrap 18b9132…:578)
at __webpack_require__ (bootstrap 18b9132…:555)
at bootstrap 18b9132…:578
webpackMissingModule @ router.js:9
(anonymous) @ router.js:9
__webpack_require__ @ bootstrap 18b9132…:555
fn @ bootstrap 18b9132…:86
(anonymous) @ index.js:22
__webpack_require__ @ bootstrap 18b9132…:555
fn @ bootstrap 18b9132…:86
(anonymous) @ bootstrap 18b9132…:578
__webpack_require__ @ bootstrap 18b9132…:555
(anonymous) @ bootstrap 18b9132…:578
(anonymous) @ bootstrap 18b9132…:578
webpackHotDevClient.js:233 Error in ./src/components/Login.js
Syntax error: Unexpected token (16:46)
14 |
15 |
> 16 | const PrivateRoute = ({ component: Component, ...rest }) => (
| ^
17 | <Route {...rest} render={props => (
18 | fakeAuth.isAuthenticated ? (
19 | <Component {...props}/>
@ ./src/router.js 25:13-42
看来我正在导入我应该安装的所有东西,所以我的想法是我没有安装应该安装的东西。
有谁知道我可能需要安装什么才能解决此错误?
spread ...
syntax 不是 es2015
或 react
babel 预设的一部分。目前是第 3 阶段提案。要在 React 项目中启用对传播的支持,请安装 babel stage 3 插件:
npm install --save-dev babel-preset-stage-3
并将其添加到您的 .babelrc
:
{
"presets": [
"es2015",
"react",
"stage-3"
]
}