heroku login =>
Error Plugin: heroku: could not find package.json with {
type: 'core',
root: 'C:\\Users\\m7sns\\AppData\\Roaming\\npm\\node_modules\\heroku',
name: '#oclif/plugin-help'
}
Reinstalled Heroku CLI, changed terminals, created new projects and I still get this, I cannot push my stuff to Heroku
Related
So I am running into a weird issue. I used Laravel Nova (2) command to generate a tool. It sits at ./nova-components/CustomNovaDashboard. In order for the deployment to work on Laravel Vapor, I had to add the below to my parent composer.json.
{
"type": "path",
"url": "./nova-components/CustomNovaDashboard",
"options": {
"symlink": false
}
}
This above allows the code to get deployed, because the absence of symlink in options would otherwise throw the following error:
include(/tmp/vendor/composer/../acme/custom-nova-dashboard/src/ToolServiceProvider.php): failed to open stream: No such file or directory
But the problem now is that when I run npm run watch inside ./nova-components/CustomNovaDashboard, the code in development never updates, because somehow there is a copy of the code that sits in vendor/acme/custom-nova-dashboard that doesn't pick up the changes.
How can I solve this?
I found a solution, it was quite simple.
In my vapor.yml, I had to add COMPOSER_MIRROR_PATH_REPOS=1 before composer install.
build:
- 'COMPOSER_MIRROR_PATH_REPOS=1 composer install'
- 'php artisan event:cache'
- 'npm ci && npm run dev && rm -rf node_modules'
This ensures the symbolic link generated by nova:tool works on dev and prod similarly.
Just don't forget to set "symlink": true in your composer.json. Or leave it as is originally generated by the nova:tool command.
I have a Rails 6 app that was successfully deployed to Heroku and worked on localhost:3000.
I added tailwindcss via yarn and webpack. It runs perfectly fine on localhost, but does not run on heroku. When I run heroku logs I get the following error
I've read all the Heroku Rails 6 Webpacker issues, and tried all the suggestions. Nothing worked.
I have commented out <%= stylesheet_pack_tag %> ... didn't help
I have toggled extract_css: true in webpacker.yml file .... didn't help
I have run
heroku buildpacks:clear
heroku buildpacks:set heroku/nodejs
heroku buildpacks:add heroku/ruby
... didn't help
Does anyone have any idea what is going on?
My github repo is https://github.com/HundredBillion/enneagram
Stumbled across this post while stuck on a similar problem, hopefully this info will help someone in the future.
I solved my issue within the package.json file by moving the "tailwindcss" reference from the devDependencies to the dependencies block.
{
"name": "app_name",
"private": true,
"dependencies": {
"#rails/actioncable": "^6.0.0",
"#rails/activestorage": "^6.0.0",
"#rails/ujs": "^6.0.0",
"#rails/webpacker": "4.2.2",
"jquery": "^3.5.1",
"tailwindcss": "^1.2.0", // <--- Now here.
"turbolinks": "^5.2.0"
},
"version": "0.1.0",
"devDependencies": {
//<--- Was here.
"webpack-dev-server": "^3.10.3"
}
}
I had the same problem with you but I tried this one and it worked for me.
Inside of config/webpacker.yml, you must set extract_css: true default is false.
I had a different error where after updating/fiddling with tailwind my create-react-app wouldn't deploy (highly likely something it did).
my buildpack was node.js. changed per https://github.com/mars/create-react-app-buildpack#user-content-troubleshooting
Confirm that your app is using this buildpack:
heroku buildpacks
If it's not using create-react-app-buildpack, then set it:
heroku buildpacks:set mars/create-react-app
…and deploy with the new buildpack:
git commit --allow-empty -m 'Switch to create-react-app-buildpack'
git push heroku master
I have a few suggestions for you, let me know which one (if any) work for you.
In webpacker.yml for all instances of the below options
check_yarn_integrity: false
compile: true
Try
./bin/setup
rails webpacker:clobber
rails webpacker:compile
If none of the above work then perhaps one of these links will help:
https://github.com/tailwindcss/discuss/issues/4#issuecomment-341918136
https://github.com/rails/tailwindcss-rails
I keep getting this error when deploing to Heroku. Build process was succesfull but then I get this error. Can't figure out what is the problem and shouldn't path be src/server/views? Everything is working locally.
Error: Failed to lookup view "index" in views directory "src\server/views"
[web.1]:at /app/node_modules/express/lib/router/index.js:281:22
app[web.1]:at param (/app/node_modules/express/lib/router/index.js:354:14)
app[web.1]:at Function.render(/app/node_modules/express/lib/application.js:580:17)
app[web.1]:at param (/app/node_modules/express/lib/router/index.js:365:14)
app[web.1]:at Route.dispatch (/app/node_modules/express/lib/router/route.js:112:3)
app[web.1]:at Layer.handle [as handle_request] (/app/node_modules/express/lib/router/layer.js:95:5)
I use webpack tu bundle my server side code and I use html-webpack-plugin to inject my index.ejs template from views folder to webpack bundle.
webpack.config.server.js
module.exports = {
devtool: 'source-map',
performance: {
hints: false
},
target: 'node',
node: {
__dirname: true,
__filename: true
},
entry: {
bundle: './src/server/prodServer.js'
},
output: {
path: path.join(buildPath, 'build'),
filename: '[name].js'
}
...
plugins: [
new HtmlWebpackPlugin({
template: 'ejs-loader!./src/server/views/index.ejs'
})
]
prodServer.js
app.set('view engine', 'ejs')
app.set('views', path.join(__dirname, 'views'))
folder structure
as you can see I have index.ejs inside views folder. prodServer is my server file and after webpack build I get bundle file and index.html.
In Heroku start script I run node ./src/build/bundle.js
It is because of how your __dirname is defined in Heroku. If you run heroku run bash and then run pwd you will see that your current working directory is /app, hence why /app is added in front of all your paths.
Try to play around with the command ls in your bash to see if your server folder is listed, and then with a cd server command see if the views file is there as well. Note that it is case sensitive, so most likely you had it defined in uppercase.
Also, note that it adds a src\ (with a backward slash instead of forward slash) to your src\server/views path, which could be from a wrong configuration in your webpack.config.server.js file.
I had the same problem and it was enough to change the script from package.json "start": "node app.js"
to
"start": "nodemon app.js"
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