I have the MailGun addon working successfully on my staging app in Heroku. I am trying to configure it for my review apps on the same pipeline. Here is my app.json:
{
"name": "App name",
"repository": "https://github.com/...",
"stack": "heroku-22",
"environments": {
"test": {
"scripts": {
"test": "yarn test"
},
"formation": {
"test": {
"quantity": 1,
"size": "Standard-2X"
}
}
}
},
"addons": [
"mailgun:starter"
]
}
I've got the same mailgun env vars in the review app configuration as I do the functioning staging app. When I try to build review apps, I get the error:
An error occurred
Could not create test run. The account "...#herokumanager.com" is not permitted to install the mailgun add-on at this time. Your account may require additional verification. Please visit https://tools.heroku.support/addons-verification to complete this process.
Following the link leads me to a page requesting my phone number. I enter it. I get a verification text with a Heroku Add-ons Verification code, which I then enter into the next screen. But I still can't build the app without the error.
Related
I created a fresh gatsby site by using the command npm init gatsby on a M1 Mac. I kept all options to default in the wizard and started by npm run develop. I immediately get this error on every refresh:
Although it's annoying the site is working fine. The error doesn't give much information and I couldn't find anyhting on google. My node version is v17.2.0 and this is the auto generated package.json:
{
"name": "my-gatsby-site",
"version": "1.0.0",
"private": true,
"description": "My Gatsby Site",
"keywords": [
"gatsby"
],
"scripts": {
"develop": "gatsby develop",
"start": "gatsby develop",
"build": "gatsby build",
"serve": "gatsby serve",
"clean": "gatsby clean"
},
"dependencies": {
"gatsby": "^4.3.0",
"react": "^17.0.1",
"react-dom": "^17.0.1"
}
}
EDIT:
I'm using Firefox.
There's a lack of details despite being a starter command (browser, browser version, etc). I'd try to follow one of the suggestions of this GitHub thread:
If you are registering a service worker, try commenting/removing it
If not, play around with the browser cookies (allowing or disallowing):
Allowing the localhost:8000 cookies.
In the same way, using the opposite cookie approach, you can disable the "Delete cookies and site data when Firefox Developer Edition is closed" option.
This solved the problem, no error anymore:
I worked around the issue by disabling the "Delete cookies and site
data when Firefox Developer Edition is closed" option
Source: https://github.com/gatsbyjs/gatsby/issues/16076#issuecomment-536152468
I am hosting a Satis Private Repository currently on my local machine while I do some debugging and testing. I have added a repository too which currently just contains a project on GitLab which included a composer package.
Currently it is being pulled from a docker image, and is hosted at localhost:8002.
My repository is setup in my Laravel project as follows:
"repositories": [
{ "packagist": false },
{
"type": "composer",
"url": "http://localhost:8002/packages.json"
}],
And if I navigate to that URL in my browser I get the following output:
{
"packages": [],
"includes": {
"include/all$949e06d91b8be4b54109a0b06c31805a5735a1ba.json": {
"sha1": "949e06d91b8be4b54109a0b06c31805a5735a1ba"
}
}
}
However, if I try to composer update the Laravel project, I get the following errors depending on if I execute it from within the container.
The "http://localhost:8002/packages.json" file could not be downloaded (HTTP/1.1 504 Gateway Timeout)
[Composer\Downloader\TransportException]
The "http://localhost:8002/packages.json" file could not be downloaded: failed to open stream: Address not available
If anyone would be able to point me in the right direction at all I would really appreciate it, as I am scratching my head here.
I am trying to host my web site using Github Pages. I am currently using Web Components and Lit-HTML (No Lit Element). No server side code. Just using NPM and Node Modules. I am wanting to build the site and publish to my git branch gh-pages but I am not quite sure what steps I need to take as currently the page error as it can not find the dependencies.
I am currently running the site locally using WAMP on my Windows Machine. Works perfectly here. Not sure if its possible to compile the code so that its in a Jekyll format
EDIT: I know how to push the code to Github. Just not sure how Github uses Node Modules to build the site.
Here is my Package.json
{
"name": "Repo",
"version": "1.0.0",
"description": "Description",
"dependencies": {
"#webcomponents/webcomponentsjs": "^2.2.1",
"lit-html": "^1.0.0"
},
"repository": {
"type": "git",
"url": "git+https://github.com/username/Repo.git"
},
"author": "ME",
"license": "ISC",
"bugs": {
"url": "https://github.com/username/Repo/issues"
},
"homepage": "https://homepage.com"
}
It depends from where you want to get the dependencies.
Do you want to host them yourself on your own site? Maybe it's not necessary. Instead you could get them directly from their original CDN.
For webcomponentsjs, according to their website, it's on the unpkg.com CDN.
<script src="https://unpkg.com/#webcomponents/webcomponentsjs#^2/webcomponents-bundle.js"></script>
For lit-html, according to the doc, it's on the unpkg.com CDN too:
import {html, render} from 'https://unpkg.com/lit-html?module'
First of all, recently I just try the Review Apps feature & notice an issue that the worker (or something that create new instance for review automaticaly) is always fails to create new server instance when I set env key in my app.json file.
Here my scenario.
Let's say I've already create new Laravel project & push it to heroku.
I create app.json file and add this line of codes
{
"name": "Laravel Project",
"image": "heroku/php",
"scripts": {
"postdeploy": "php artisan migrate --force"
}
}
I create Procfile file and add this line
web: vendor/bin/heroku-php-nginx -C custom-nginx.conf -i custom-php.ini public/
Push latest changes to heroku & enable Review Apps feature to my pipeline
I create new branch that contain some fixes & make a pull request,
I see my pipeline automaticaly create new server instance for my pull request, but it's failed to deploy due to database configuration is not set yet.
Now, I need to add env key to my app.json and add my database configuration.
{
"name": "Laravel Project",
"image": "heroku/php",
"scripts": {
"postdeploy": "php artisan migrate --force"
},
"env": {
"APP_ENV": "staging",
"DB_CONNECTION": "sqlite"
}
}
But, when I push it heroku couldn't create the new server instance & I can't see any error log or something that tell me information about what happen. I can only see Create Review App button on my pipeline
and, multiple deployment request on my github PR.
There's something missing from my config? or anyone have solution for me?
Thanks & sorry for my english.
I'm not sure, but the problem here might be, that you use SQLite. Heroku's file system is read-only, so SQLite won't work. My tip would be to try a different DB like postgres for your review apps.
Is was wondering if its possible to deploy a React Native app to Heroku? The reason I ask is because then I can retrieve the url and place it in an iframe to mimic an iPhone where the user can then tryout the app without actually having to install it on to the iPhone via iTunes.
This is possible using react-native-web (sources).
There are few things that you have to do to set this up on heroku:
in the settings tab of your your heroku app dashboard
set the buildpack as heroku/nodejs,
in package.json set the build script to build your web version from RN sources, for example, if you are using expo: expo build:web,
create a Procfile in the root directory to serve the web
version: for example, if you used expo, the build directory is web-build and therfore the command should be npx serve web-build,
Additionally, if you use expo, make sure to add the expo-cli as a dev dependency: npm install -D expo-cli.
You will then simply need to push to heroku the usual way. By default, heroku will run yarn build (or npm run build depending on wether you used one or the other to generate your lock file).
In the end, here is what the package.json file might look like (using expo again):
{
"main": "node_modules/expo/AppEntry.js",
"scripts": {
"start": "expo start",
"android": "expo start --android",
"ios": "expo start --ios",
"web": "expo start --web",
"eject": "expo eject",
"test": "jest --watchAll",
"build": "expo build:web"
},
"jest": {
"preset": "jest-expo"
},
"dependencies": {
"#expo/vector-icons": "^12.0.0",
"#react-native-community/masked-view": "0.1.10",
"#react-navigation/bottom-tabs": "^5.11.1",
"#react-navigation/native": "^5.8.9",
"#react-navigation/stack": "^5.12.6",
"expo": "~40.0.0",
"expo-asset": "~8.2.1",
"expo-constants": "~9.3.0",
"expo-font": "~8.4.0",
"expo-linking": "~2.0.0",
"expo-splash-screen": "~0.8.0",
"expo-status-bar": "~1.0.3",
"expo-web-browser": "~8.6.0",
"react": "16.13.1",
"react-dom": "16.13.1",
"react-native": "https://github.com/expo/react-native/archive/sdk-40.0.1.tar.gz",
"react-native-gesture-handler": "~1.8.0",
"react-native-safe-area-context": "3.1.9",
"react-native-screens": "~2.15.0",
"react-native-web": "~0.13.12"
},
"devDependencies": {
"expo-cli": "^4.0.16",
"#babel/core": "~7.9.0",
"#types/react": "~16.9.35",
"#types/react-native": "~0.63.2",
"jest-expo": "~40.0.0",
"typescript": "~4.0.0"
},
"private": true
}
And the Procfile simply consists of a single line:
web: npx serve web-build
You could probably achieve similar results using reactxp instead of reac-native-web, but I never tried it myself.
Client side routing
Configuring Heroku for client side routing
If you use client side routing (react navigation for example), you will have to setup a few more things to make sure linking works. With the previous build alone, client side routing will fail (404 errors) because heroku will try to route requests on its own, but your app needs everything to end up at index.html so it can perform routing tasks on its own (client side routing).
We will thus prevent any Heroku routing by adding a second buildpack heroku-community/static next to heroku/nodejs. This second buildpack is configured via a /static.json file (default values):
{
"root": "web-build/",
"clean_urls": false,
"routes": {
"/**": "index.html"
}
}
Configuring webpack for client side routing
You probably already have this part setup because otherwise you would have 404 errors even locally. To allow client side routing it seems like we also need to configure webpack (output.publicPath and devServer.historyApiFallback), with expo this can be done by running expo customize:web and then editing /webpack.config.js with:
const createExpoWebpackConfigAsync = require('#expo/webpack-config');
module.exports = async function (env, argv) {
const config = await createExpoWebpackConfigAsync(env, argv);
config.output.publicPath = '/';
config.devServer = {
...config.devServer,
historyApiFallback: true,
};
return config;
};
There is a nice article about these routing issues you might have here: Fixing the 'cannot GET /URL'
Steps for deploying React native/expo app to heroku:
1:
set heroku buildpack as static: >heroku buildpacks:set heroku-community/static
2:
Add static.json for static buildtype:
{
"root": "web-build/",
"routes": {
"/**": "index.html"
}
}
More settings here: https://github.com/heroku/heroku-buildpack-static#configuration
3:
npm run build (package.json: "build": "expo build:web") --> Creates web-build folder
git add .
git commit
git push heroku master
heroku open