Compatibility with Expo apps #8
Comments
|
Hi @bboydflo , a quick feedback here.
|
|
Hey, thanks for your reply.
Will try to see how/if I can enable Turbo Modules with expo. |
|
@bboydflo , I actually meant it should work without Turbo Modules (at least works for me), rather then with them :) Though, I haven't tried it with expo. Agh... also all my projects I use it are JS and not TS. Probably, there is some minor mistake in TS, or something particular about TS config in expo, which makes |
|
Could be. I realized that I also had another webpack-dev-server running in another tmux window which might have an effect on the current expo app. Will try again with a simple js project as well. |
|
Hey @bboydflo , I double-checked it indeed does not work in an expo app out of the box, and in my current understanding it is just expo not supporting custom react-native libraries, which rely on native code, unless you build and deploy the resulting expo app in a special way. See Adding custom native code to Expo guide. I don't know, whether something can be done in a RN library to make it Expo-friendly, and at this time it is beyond my interests and capacity to figure it out myself. |
birdofpreyru
changed the title
|
thanks! will try it with crate react native app instead |
|
Hi @bboydflo and @birdofpreyru, this library can be used with Expo, but you need to use Also when using prebuild, you can use config plugins to customize your project from JavaScript without ever needing to directly modify Xcode or Android Studio projects. From my testing so far, it seems you don't need a config plugin for this library. More info: |
|
|
|
I guess |
I put source file html in here |
|
I think, it is not. It should be a path on the target device, and if you read README carefully, it uses |
Thank you, I'm done, however it takes a few seconds to move file & start the server |
|
same problem, |
|
Hey @lovetingyuan, have you followed what @viljark wrote (#8 (comment))? |
I create a new expo project, and I run |
|
@lovetingyuan have you built the expo development client after you added the package? |
|
should I run |
|
frankly I had to re-learn vanilla react to use this lib... dev wuz efficient with expo. Also, it really needs a good example when working with webview especially the directories |
|
@mihkuno it sounds like now you might be a valuable contributor to expand the Readme regarding Expo use of the lib :) improving other aspects of Readme is on my todo list. |
|
I'm having exactly the same error as @lovetingyuan, I'm using the older version because I can't drop support for Android SDK <28. |
|
@leandronorcio It looks like you telling it to server files from a location it has no access to. Here is the Java code block where you hit the error (specifically on if(root != null && (root.startsWith("/") || root.startsWith("file:///"))) {
www_root = new File(root);
localPath = www_root.getAbsolutePath();
} else {
www_root = new File(this.reactContext.getFilesDir(), root);
localPath = www_root.getAbsolutePath();
}i.e. it looks like you provided empty or relative |
|
|
|
Not sure if this is the same issue, but I get the following error using Expo: This is my code: import React, { useEffect, useState, useRef } from 'react';
import { StatusBar } from 'expo-status-bar';
import { StyleSheet, Text, View, SafeAreaView } from 'react-native';
import { WebView } from 'react-native-webview';
import StaticServer from "@dr.pogodin/react-native-static-server";
export default function App() {
const serverRef = useRef();
if (!serverRef.current) serverRef.current = new StaticServer(5555, "./assets/out", { localOnly: true, keepAlive: true });
const server = serverRef.current;
const [uri] = useState(`http://localhost:${server.port}`);
useEffect(() => {
server.start().then((url) => {
console.log("Serving at URL", url);
});
() => {
// Stop the server
server.stop();
}
}, []);
const webViewProps = {
javaScriptEnabled: true,
androidLayerType: 'hardware',
originWhitelist: ['*'],
allowFileAccess: true,
domStorageEnabled: true,
mixedContentMode: 'always',
allowUniversalAccessFromFileURLs: true,
scalesPageToFit: true,
};
const Header = () => (
<View style={styles.header}>
</View>
);
return (
<SafeAreaView style={{ flex: 1 }}>
<StatusBar style="light" />
<Header />
<WebView
style={styles.container}
source={{ uri }}
{...webViewProps}
/>
</SafeAreaView>
);
}
const styles = StyleSheet.create({
header: {
paddingTop: 15,
paddingBottom: 10,
backgroundColor: "#ec3c3c"
},
title: {
color: "#fff",
fontSize: 20,
fontWeight: "bold",
textAlign: "center"
},
container: {
flex: 1,
backgroundColor: '#fff',
alignItems: 'center',
justifyContent: 'center',
paddingTop: 40,
},
}); |
|
Server constructor() has different signature. |
|
Hi there,
However, when I follow @viljark comment, trying to run "npx expo prebuild --platform iOS"
Should I fold back to previous version like @dr.pogodin/[email protected]? Update: I got this error after running ` ERROR Error: The package '@dr.pogodin/react-native-fs' doesn't seem to be linked. Make sure:
|
|
@evanNyew the original error you got does not look to me related to this library, nor Expo, and it just says that the minimum deployment target (iOS version) set in your Xcode project is lower than those declared by pods you are trying to use. As of the latest RN, the deployment target should be 13.4 or higher (see this). The latter error looks like some incompatibility between the older library version and the RN version... but might be something Expo-related, I don't know. |
|
Hi, @birdofpreyru . I've created a tutorial on how to use this library with Expo. It's not strictly Expo, as you'll need to make a development build, but I don't think it should be too much of an issue. Check out my tutorial, I hope it helps you. https://github.com/jole141/expo-examples/tree/react-native-static-server |
|
Great! Thanks @jole141 , I'll refer your tutorial in README later. |
|
Hi @birdofpreyru, thanks for this package. Could you please mention by when can you start the work on officially supporting Expo? A lot of people are trying to use this package in their Expo managed projects and in some cases, the example by @jole141 does not work. |
As soon as somebody sponsors it 😎 |
|
Another data point, I got this library to work for both iOS and Android on Expo 52 using New Architecture, here is the POC: https://github.com/benjaminkomen/expo-static-server |
|
Great @benjaminkomen ! Though, the repo you linked seems to be private — I see Error 404 when accessing the link. |
Whoops, it is public now. One thing I noticed in my tests, is that I can host static files like images or videos, but when I tried to pick a binary file (like an APK), it did not work, there was no error message, it just refused to serve the file. Is that expected behaviour? |
No idea — I haven't encountered such a problem. How do you test it, isn't it the case that a browser, or some tool, just ignores attempts to fetch some binary files due to security considerations, while the server serves them fine? Anyway, I think if you enable all |
hi, thanks for this package. I am trying to use it in an expo app. and I got this error:
TypeError: null is not an object (evaluating 'FPStaticServer.start'Any idea what I am doing wrong? Here is my code:
Here is some output in my logs:
And below are some expo logs:
The text was updated successfully, but these errors were encountered: