npm start失败，本地依赖项中的文件中出现意外令牌 [英] npm start fails with unexpected token in file from local dependency

问题描述

我使用 create-react-app 创建了 first-app ，其中组件使用了

I made first-app with create-react-app where a component makes use of some material-ui components, and it is working fine when started with npm start.

从此应用程序中，我在一个新的 nice-component 文件夹中提取了该 nice-component 组件，并使用了 package.json 在 .js 文件中，该文件 export default 组件类-在Visual Studio Code中，我可以成功导航到其源代码，因此我猜想安装程序/文件夹配置是正确的

From this application I extracted that nice-component component in a new nice-component folder, with its package.json, the component is in a .js file that export default the component class - in Visual Studio Code I can succesfully navigate to its sources, so I would guess the setup / folder configuration is correct.

在 final-app 应用程序中，仍然使用 create-react-app 制作的新应用程序，我添加了 nice-component 作为本地依赖项(文件:../nice-component )，但是当我运行 npm start 时，我得到:

In final-app application, a new application still made with create-react-app I added nice-component as a local dependency (file:../nice-component), but when I run npm start I get:

SyntaxError: C:\...\other-package.js: Unexpected token (83:8)

  81 |       const { classes } = this.props;
  82 |       return (
> 83 |         <Grid container className={classes.root} style={{margin:30}}>
     |         ^

我不知道为什么会发生这种情况，似乎本地依赖项没有引入他们自己的(可传递的)依赖项，但是几个月前我在另一个项目中成功使用了类似的方法-尽管我没有使用react-scripts ，但是我自己设置babel，webpack等.

I can't figure out why that happens, it seems that local dependencies do not bring in their own (transitive) dependencies, but I successfully used a similar approach months ago in another project - where though I didnt use react-scripts, but set up babel, webpack, etc by myself.

我什至尝试在 final-app 中添加所有material-ui依赖项(尽管我不认为我不应该这样做)，但是它不起作用.

I even tried adding all of material-ui dependencies in final-app (although I don't think I shouldn't), but yet it doesn't work.

推荐答案

问题意外令牌'<'是因为缺少babel预设.

The issue Unexpected token '<' is because of missing the babel preset.

您可以使用node来简单地安装babel依赖项，

you can simply install the babel dependency using node as follows

npm install babel-preset-react

谢谢

这篇关于npm start失败，本地依赖项中的文件中出现意外令牌的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！