在Web應用程序中使用React-Native

-1

我安裝了Expo XDE，並創建了一個新項目funproject。我知道XDE是用於設備的，我可以連接我的虛擬設備。在Web應用程序中使用React-Native

但是，我也想重複使用相同的代碼基地爲Web應用程序。

我已經喚醒了應用程序應該在我的本地主機上的位置。

http://localhost:19001/

這看起來不錯，我可以看到index.html頁面。這是實際的文件路徑。

funproject\node_modules\react-native\local-cli\server\middleware\index.html

這裏是的index.html

<!DOCTYPE html> 
<html> 
<head> 
    <title>React Native</title> 
</head> 
<body> 
    <p>React Native packager is running.</p> 
    <p><a href="http://facebook.github.io/react-native/">Visit documentation</a></p> 
</body> 
</html>

所以我增加了對內容和腳本一個div內容，app.js

<!DOCTYPE html> 
<html> 
<head> 
    <title>React Native</title> 
</head> 
<div id="content"></div> 
<body> 
    <p>React Native packager is running.</p> 
    <p><a href="http://facebook.github.io/react-native/">Visit documentation</a></p> 
</body> 
</html> 
<script type="text/javascript" src="../app.js"></script>

我是新來的反應，但我可以將網絡和移動設備集於一身的想法非常誘人。不幸的是，這是行不通的！當我使用Chrome開發人員工具，我收到此錯誤app.js

Uncaught SyntaxError: Unexpected token import app.js:1

的1號線在這裏是默認生成的app.js

import React from 'react'; 
import { StyleSheet, Text, View } from 'react-native'; 

export default class App extends React.Component { 
    render() { 
    return (
     <View style={styles.container}> 
     <Text>Open up App.js to start working on your app!</Text> 
     </View> 
    ); 
    } 
} 

const styles = StyleSheet.create({ 
    container: { 
    flex: 1, 
    backgroundColor: '#fff', 
    alignItems: 'center', 
    justifyContent: 'center', 
    }, 
});

來源

2017-07-03 christopher clark

能下降的人，關心分享爲什麼？ –

你有它大多是錯的，其實 - 都是錯的。

讓我們開始吧;

However, I would also like to reuse the same code base for a web application.

因此，這是不對的，你從事的項目是土生土長的項目，該項目採用的反應基於組件的渲染邏輯，併產生對Android或iOS真實合法的原生UI元素。

即使您仍在使用「反應」，這並不意味着您可以在瀏覽器中重複使用該應用程序。

在開發界面中啓動的本地服務器或爲您的手機或模擬器（爲了通過WiFi網絡訪問它）的包交付和更新系統（包裝器）。

該服務器及其上下文僅僅是一個開發工具。

You should first understand the logic behind tech you are using; https://facebook.github.io/react-native/docs/getting-started.html

來源

2017-07-05 15:11:05

「相同的代碼庫」並不等於所有的代碼。實際上有很多項目將業務邏輯從顯示邏輯中分離出來。我不知道這些方法。現在我已經學到了更多關於'npm'的知識。但你是對的，這是錯的。我甚至沒有正確使用「反應」。我開始關注這個項目。 http://jkaufman.io/react-web-native-codesharing/ –

在Web應用程序中使用React-Native

回答

相關問題