【问题标题】:Unexpected token (9:13) error when trying to launch react app in terminal尝试在终端中启动反应应用程序时出现意外令牌 (9:13) 错误
【发布时间】:2022-01-21 19:23:45
【问题描述】:

我是新人,目前正在使用 React Native 将我的网站转换为移动应用程序,我遇到了这个错误。如果有人可以提供帮助,我将不胜感激! :)

这是我得到的错误:

iOS Bundling failed 790ms
SyntaxError: /Users/jj/nurse-job/App.js: 
Unexpected token (9:13)



7 |             <WebView
8 |                 source={{ url: { 
https://www.praecuro.com }}}
9 |     style = {{ marginTop: 20 }}
 |              ^
10 | />
11 |     );
12 |   }

这里是 app.js 中的完整代码

import * as React from "react";
import { WebView } from "react-native- 
webview"; export default class App extends 
React.Component {
render() {``
    return 
        <WebView
            source={{ url: { 
https://www.praecuro.com }}}
style = {{ marginTop: 20 }}
/>
);
}
}

【问题讨论】:

    标签: javascript reactjs react-native


    【解决方案1】:

    我在 react native 方面没有经验,但您的 URL 应该是 string?。看看documentation

     <WebView
       source={{
              uri: 'https://github.com/facebook/react-native'
            }}
    style = {{ marginTop: 20 }}
    />
    

    【讨论】:

      【解决方案2】:

      我认为您的网址设置不正确。 {{ 内部是一个 json 文字,您应该使用 '' 来设置值。

      source={{ url: 'https://www.praecuro.com' }}
      

      【讨论】:

      • 感谢您的反馈。由于某种原因,我仍然遇到同样的错误
      【解决方案3】:

      试试这个

       return (
            <WebView
              source={{ uri: "https://www.praecuro.com" }}
              style={{ marginTop: 20 }}
            />
          );
      

      【讨论】:

        【解决方案4】:

        url 中删除{} 将解决此问题,同时在&lt;View&gt;&lt;/View&gt; 中使用您的WebView。在react-native-webview 的使用指南中,它告诉source 道具你必须使用 uri 而不是 url

        另外,请确保您的代码中包名称或其他任何内容之间没有多余的空格。

        您的代码应如下所示:

        import React from "react";                       //this
        import { View } from "react-native";
        import { WebView } from "react-native-webview"; 
        class App extends React.Component {    //Mention your class like this
        render() {
            return (
              <View>
                <WebView
                    source = {{ uri: "https://www.praecuro.com" }}
                    style = {{ marginTop: 20 }}
                />
              </View>
            );
          }
        }
        export default App;                 //Then export it separately
        

        希望这对你有用。

        【讨论】:

        • 感谢您的反馈。我尝试添加这个并得到这个错误。未终止的字符串常量。 (2:24) 1 |从'react'导入*作为React; > 2 |从“react-native- | ^ 3 | webview”导入 { WebView }; 4 |导出默认类 App 扩展 React.Component { 5 |渲染() {
        • 你确定你使用的代码和我提到的一样吗?我刚刚更新了我的答案。可能存在间距问题。
        • 看起来代码可能有效,但现在我收到一个单独的错误。在项目或以下目录中找不到 react-native-webview:node_modules ../node_modules
        • 确保 react-native-webview 是否在您的 node_modules 中,并且在 package.json 依赖项中也有提及。如果它不存在或链接它,请尝试再次安装它。你也可以再次运行npm install
        • 谢谢你能够过去,现在我有了这个。检查App的渲染方法。此错误位于: in RCTView(由 View 创建) in View(由 App 创建) in App(由 ExpoRoot 创建) in ExpoRoot in RCTView(由 View 创建) in View(由 AppContainer 创建) in DevAppContainer(由 AppContainer 创建)在 RCTView(由 View 创建)在 View(由 AppContainer 创建)在 AppContainer 中非常感谢您的帮助!
        猜你喜欢
        • 1970-01-01
        • 2018-03-26
        • 2022-01-18
        • 2011-06-13
        • 2018-12-08
        • 2023-01-28
        • 2020-10-18
        • 1970-01-01
        • 2023-02-14
        相关资源
        最近更新 更多