How to fix missing functions directory problem with Netlify continuous deployment? - reactjs

I followed steps from the official Netlify Docs:
I run npm run build and building process was finish correctly.
Then the docs suggest to run netlify deploy --open but it gives me the following error:
No such directory C:\Users\Concierge\Downloads\prod\ColorApp2\MaterialColorPickerCOM\functions! Did you forget to create a functions folder or run a build?
I tried to use command netlify deploy --prod as recommended by one user but it gives me the same error. The website is visible on my Netlify account but doesn't work: Here is the link
Do you guys have any idea how to fix it?

Not building Netlify functions
If you are not building functions, then make sure to not include a functions target directory in your netlify.toml
[build]
command = "npm run build"
publish = "build"
# functions = "functions"
Including Netlify functions
If you are including Netlify lamdbda functions with your project. Make sure after a build that there is a directory created that is specified in the functions value.
The example below expects there to be functions in a /functions directory after a build prior to a deploy or it will fail.
netlify.toml
[build]
command = "npm run build"
publish = "build"
functions = "functions"

Related

How to specify runtime directory for Vite when running the dev server

I'm trying to use Vite for a React project. I need to configure Vite so that when I run the dev server it places the runtime files in a particular directory (because the files are used with another runtime environment). The server config doesn't seems to have an option but I'm not sure if I'm missing something or it is in a different place. Thanks
It doesn't seem to be possible right now according to this repo discussion https://github.com/vitejs/vite/discussions/6108
Meanwhile, you could run the dev command along with the build --watch command to have both, but it would get slower
npm run dev & npm run build -- --watch

Where does React put the continuous build files when using create-react-app

I'm using create-react-app. When I run npm start (react-scripts start) it continuously builds the changes for me and does it magic. But what is the output folder for that? I know when I build it manually where the files go.
I want to use firebase emulator to serve the current version (the continuous build) of my react all but I don't understand where's the output folder or how to achieve it.
You could try this package https://github.com/Nargonath/cra-build-watch
Install it and add the script to your package.json
{
"scripts": {
"watch": "cra-build-watch"
}
}
and run it
npm run watch
more info here
https://ibraheem.ca/writings/cra-write-to-disk-in-dev/
and if you go to the react repo issue linked in the article you would find more workarounds
tl;dr
run npm run build, not npm run start
More Detail
react-scripts start runs webpack-dev-server internally. As a default setting, webpack-dev-server serves bundled files from memory and does not write files in directory.
If you want to write files with webpack-dev-sever, you could set writeToDisk option to true in your dev server configuration.
However, I dont think this is what you want to serve on firebase emulator. Webpack-dev-server does not build optimal app for production, and you also need to use react-app-rewired to customize dev server configuration in cra template.
What you want to do is npm run build to run react-scripts build, which builds optimized production app in /build directory.

Gatsby site 'page not found' when deploy on Netlify or Surge

I could run on localhost, however the site could not show up on Netlify and Surge as I tried to push it on Git. Feel free to check my code: https://github.com/treycwong/bean-tracker
I'm not sure if it's partly due to the dependencies in package.json or if I need to install Yarn? If so, some guidance will be helpful.
Added build settings on Netlify
Removed yarn.lock
With Surge, I've followed the instructions, I've deployed it successfully but still the page shows 'page not found'.
Your Netlify setting should be as follows, if you are not going to use yarn.
Publish location: public
Build command: npm run build
/netlify.toml
[build]
publish = "public"
command = "npm run build"
I know it's an old post but this could help more than one.
I've just deploy a Gatsby site to Netlify and I got the Page Not Found error.
I fixed it configuring the build settings as following:
Once I did it I got a Node error cause Netlify works by default with an old version. So I needed to force to use a newer one setting the Environment variable to the same I'm using locally:
Hope it helps to someone else!

Need help deploying react application with netlify

Not familiar with how to use netlify. Im trying to deploy this app
https://github.com/Rshauneb/real-estate
my build command is:
npm run watch
but every time I try to deploy my site I keep getting this error.
"failed during stage 'building site'"
Any suggestions?
Mimic what Netlify is doing in the build using their build bot.
Clone your project into a clean directory from GitHub
npm install
npm run watch
If you do not get an error, you may have a global command or setting that does not get set on Netlify. Without more information, this is the only answer possible.
Here is the error I found when I did the above:
Problem #2
Watch is a command for local development, so you should not be using npm run watch as a build command on Netlify. You will need to run the command to build your site into a directory for deploy and use that directory for your "Deploy directory".

Why is create-react-app's build directory in .gitignore?

This is clearly something I'm misunderstanding but I'm desperately struggling to find an answer.
I've been teaching myself React with create-react-app, I've run "npm run build" to spit out my finished project, and I have the project pushed to a private bitbucket repo.
My expectation would be to then SSH to my server, and git clone the /build directory in order to make this project live. Obviously that is possible (if I removed /build from .gitignore), but since the /build directory is in .gitignore this clearly isn't the intended/desired behaviour.
So, my question is - what is? How does one publish a completed build to server without pulling from git (and obviously without FTP)?
Thanks!
The build directory is in .gitignore as it can be generated from the existing files.
To minimize upload/download time only essential items should be kept in the git repo. Anything that can be generated need not be in the repo (The build directory in this case).
If you are working on a server that has node (AWS, Heroku etc) you can git clone the entire repo on the server and then run npm run build there (after npm install). Then you can do something like
npm install -g serve
serve -s build
The serve module serves static files and you pass the build folder as a parameter.
If you are working on a more old style server like Apache static hosting with cPanel etc then you will need to upload the entire build directory containing static files and index.html.

Resources