Using docker to run a react native app, using expo - react-native

I have a small react native app, and I'm trying to run it using docker. I believe I know what my problem is, but I really can't solve it. My Dockerfile is as such:
FROM node:12
WORKDIR /client
COPY package*.json ./
RUN yarn install
RUN yarn global add expo-cli
COPY . .
ENV PORT=8080
EXPOSE 8080
CMD ["yarn", "start"]
I built my image, and then tried to run it using: docker run -p 19002:8080 53abf08beb39. Everything looks ok, expo tells me it is running in localhost:19002, and that the app is running in localhost:19000. Despite this, when i try to access these ports, I only see a "this site can't be reached" page. I was told this was because expo is exposing the port, but since it's running in docker, it can only be accessed from inside the container, so I need a way to expose this out of the container to be able to run it on my laptop. How can I achieve this?
Also, if anyone knows how should I create a docker-compose file to run all this, it would be great.

Related

Vue cli run production build on VPS server after closing console

My VPS server is all set. Node is installed, I built an app and ran it with
npm install -g serve
serve -s dist
as it was mentioned in the docs.
But after I close my console the application is not available anymore. I'm aware about PM2, but I couldnt run
serve -s dist
with it.
I would appreciate the ideas on easy way to always serve the application on server
Thanx
After struggling quite a while with nginx i finally managed to set it up properly. So as far as I understand, the only solution is to install a web-server, such as Nginx

How we could dockerizing a Proton-Native App and see the GUI?

I'm trying to dockerize a Proton-Native App, buy i'am not able of see the basic proyect
This is my Dockerfile
FROM node:13
WORKDIR /app
ENV PATH /app/node_modules/.bin:$PATH
RUN npm install
COPY . ./
RUN npx proton-native-cli init .
CMD ["npm", "start"]
Then I run
docker build -t sample:dev .
and
docker run sample:dev
Assuming that is posible see the GUI, not only access the docker image. What would be the correct way to complete the configuration?
Thanks for read! :)
This idea, dockerizing a Proton-Native App for see the gui, is not a simple task, requires "a lot of extra work to get the display to show up at all (including installing extra host software on non-Linux hosts) and even more work to get access to user preferences and data files", like #DavidMaze explains

AppCenter Yarn 1.19 error Incorrect integrity when fetching from the cache

I have a React Native app hosted on Microsoft App center. The builds (both iOS and android) are failing because of yarn 1.19 (error Incorrect integrity when fetching from the cache)
I tried to remove the package-lock.json but it didn't help.
I would like to downgrade yarn or execute the cache clean command but don't know where to execute it.
I have installed the appcenter cli version 2.2.1 and successfully connected to it.
Where could I execute yarn cache clean for example?
I've read I could also create a script but I have no idea where to place it and how it should look like. Should it be both in the ios and android directory? Or in the root? Thank you
I actually noticed that I had a yarn.lock back from the initial commit, even though we are using npm in the team.
In the build logs, there is this line:
/bin/sh -c if [ -f yarn.lock ]; then { yarn install && yarn list --depth=0; } else npm install; fi
So I deleted the yarn.lock file and now it builds successfully using npm!
Not sure whether you build your React app with Azure Devops pipeline. If yes, you can use Command line task to achieve the things you want to do.
If the agent you used is hosted agent during the build, since each build will use a completely new VM, you need to install the AppCenter cli once per build.
Use follow command to install the AppCenter cli:
sudo npm install -g appcenter-cli
Then logging in it:
appcenter login --token {Token}
Here, you need first generate the token with this doc described: Go and login to https://appcenter.ms/ -> Click Self Avatar -> Choose Account Settings -> Click on API Tokens -> Click New API token then select the corresponding the scope for this token.
Copy and use it in this pipeline task. Note: Recommend you store
this token with secret variable for security.
Now, you can execute the clean command: yarn cache clean.
Where to place it and how it should look like?
According to your description, you need place this command line task into the first step, then it could clean the Yarn cache firstly.
Also, because of the image configuration that the hosted agent is using, its installed node.js version is 6.7.0, this does not match the runtime environment for AppCenter cli. You need also run Node.js tool installer task to install node.js v10.0.0.
All of them should look like this:
Should it be both in the ios and android directory?
As I mentioned previously, for Hosted agent, each build will use a completely new VM. So yes, you must execute these two steps firstly in every build.
If what you used is your private agent, since you have installed the AppCenter cli locally, the agent will automatically call the local configuration when running the command line task. At this time, you just need to skip the install command in the command task:
We fixed it by adding a "yarn cache clean" in appcenter-post-clone.sh, you can add this shell script in root of project.
See this docs for details.

How to resolve clipboard error while deploying vuejs app on ubuntu server

I am deploying a vuejs app on my server.we have EC2 instance with ubuntu 16.04,As of now I am just deploying my test project but when I go running serve command like sudo serve -s dist but it is throwing an error which is: ERROR: Cannot copy to clipboard: Command failed: xsel --clipboard --input
xsel: Can't open display: (null)
: Inappropriate ioctl for device
I don't know this error is caused by ubuntu or vuejs please help me solve it.
I have followed these cammands so far.
First installed vue cli using
npm install -g #vue/cli
Then created a hello world app using
vue create helloWorld
Now run serve command
npm run serve
It was showing me a message like:
App running at:
- Local: http://localhost:8081/
- Network: http://172.31.16.66:8081/
Now i have created a build to run an app on the production server
npm run build
So my build was created successfully
i run command to run the app on the live server
serve -s dist
And it is throwing an error which is not solving by me so far
WARNING: Checking for updates failed (use--debugto see full error)
ERROR: Cannot copy to clipboard: Command failed: xsel --clipboard --input
xsel: Can't open display: (null)
: Inappropriate ioctl for device
I am also attaching screenshot below.
As you can see, there is an X11 dependency with the serve module - which means you need an xserver(display) for it to work.
Alternatively, (highly recommended) you could use a high performance HTTP server like nginx, apache etc. instead.
All you need is to copy your dist folder to your instance, and point your virtual server block to the dist dir, and restart your HTTP server - BAM! you're up and running.
Cheers!
I had the same issue and I solved it by adding "-n" option to serve.
"-n, --no-clipboard Do not copy the local address to the clipboard"

NPM & Docker Build

I want to "build" my npm build and create a docker image with it. That means I need a docker image that is able to a) run npm and b) run docker.
Currently I struggle in finding / creating such a docker image. How can I solve my problem?
Thanks!
Edit:
I managed to have a combined container, but my build is not able to find a running docker instance:
Post http:///var/run/docker.sock/v1.20/build?cgroupparent=&cpuperiod=0&cpuquota=0&cpusetcpus=&cpusetmems=&cpushares=0&dockerfile=Dockerfile&memory=0&memswap=0&rm=1&t=registry.gitlab.com%2Ftss-repocar%2Fapp&ulimits=null: dial unix /var/run/docker.sock: no such file or directory.
* Are you trying to connect to a TLS-enabled daemon without TLS?
* Is your docker daemon up and running?
Post http:///var/run/docker.sock/v1.20/images/registry.gitlab.com/tss-repocar/app/push?tag=: dial unix /var/run/docker.sock: no such file or directory.
* Are you trying to connect to a TLS-enabled daemon without TLS?
* Is your docker daemon up and running?
Use Packer. You run commands in Packer to do all of your NPM setup, and it will spit out a Docker container.
Here is packer
https://www.packer.io/docs/
And then I found this
https://www.npmjs.com/package/node-packer
To build docker images your build container must have access to /var/run/docker.sock (or you have to use Docker in Docker).
Assuming you have your gitlab-ci-multi-runner in a Docker Container itself, change /etc/gitlab-runner/config.toml to look like this:
volumes = ["/var/run/docker.sock:/var/run/docker.sock", "/cache"]