I made a React app with npm create-react-app which uses NodeJS backend. I am trying to deploy on Azure through Visual Studio Code extension.
I did not build locally but put a script in scripts object in package.json (of root folder)
"build": "cd client && npm install && npm run build"
My server.js resolves routing to the react app like this:
app.use(express.static("client/build"));
app.get("*", (req, res) => {
res.sendFile(path.resolve(__dirname, "client", "build", "index.html"));
});
After I configure app services, resorce plans etc and deploy to app in App Service i get
Node Sass could not find a binding for your current environment: Linux 64-bit with Node.js 12.x
Found bindings for the following environments:
Windows 64-bit with Node.js 12.x
And my Files folder in App Service is empty ( has only hostingstart.html )
I tried removing node-sass and installing it again, I tried rebuilding it but nothing helps.
You could check your node-sass version first：npm ls node-sass
Have a look at Node-sass release URL.
I think you have done the right operation by removing and reinstalling your package, make sure you run these command in the root path of your project.
npm rebuild node-sass
npm update
npm uninstall node-sass
npm install node-sass
Don't forget restart your project.
Related
So I was trying to deploy my react app to an Azure Web App.
I used a Github Action to build and install the App and then ZIP Deploy it to Azure.
The Problem is that once I open up the WebApp Page it shows me an Application Error (react-scripts could not be found).
I found out that once I copy the react-scripts.cmd / ps1 (from local /node_modules/.bin) to the node_modules/.bin folder of the webapp "https://{WEBAPP-NAME}.scm.azurewebsites.net" it works.
Unfortunately I would have to do that after every build.
How can I come up with a solution to this error?
What I already tried:
Update node and npm
Remove package-lock
Thanks in advance
Max
My package.json:
It looks like this issue: npm package.json scripts not being called
Try running npm run-script if you want to execute a script that is not executed by a built-in npm command.
So I found out, that react-scripts is only working in dev environments. But Azure uses a production env. Therefore the github action not only has to install the prod node_modules (npm install) but also the dev modules (npm install --only=dev).
Reference:
https://github.com/mars/create-react-app-buildpack/issues/32#issuecomment-276081892
I am having a npm package which serves as a local host. What I want is after user use npm install -g to install it, they can use the command easydx to run the local host and web pages can be served as in a static server.
During development, it works fine with npm start and the pages can successfully open at localhost:3666. But when I publish the package and tested it using npm install -g to install it. After easydx successfully fires the server, localhost:3666 get the cannot get / error.
My package contains the line:
"bin": {
"easydx": "index.js"
},
and my index.js file begins with
#! /usr/bin/env node
So what is going wrong here?
In my index.js file:
I have used:
app.use(express.static('dist'));
to serve the static web files. And have used express routes for the web service.
I looking into Angular universal and trying to get my head around deployment.
Github https://github.com/angular/universal-starter
It has Angular 2 Universal + TypeScript 2 + Webpack 2
When I run the command
npm run build
I get the following structure
**Client**
0.bundle
0.bundle.js.map
main.bundle
main.bundle.js.map
**Server**
0.index
0.index.js.map
index
index.js.map
How do I deploy this to a server?
Install dependencies
Run npm install in your terminal at the root of universal-starter
Run the NodeJS backend
Run npm run build:ssr && npm run serve:ssr after npm install has finished, this will host a local nodejs server here: http://localhost:4000 (you can put that in your browser)
Before either of these steps ensure you have NodeJS and NPM installed (NPM comes with the newer builds of NodeJS)
I downloaded the starter kit for react and redux. It's really nice and works fine in localhost with the command npm run dev but I'm not able to deploy it on the server.
First, I use the command npm run deploy which clean and compile my src folder in the dist folder. Then, I deploy the server on Heroku. Once all is built, the server run npm start which execute the command babel-node bin/server. This command is not recognized by the heroku server.
I would really appreciate if someone could help me to debug this. I tried to clone again the repo, then :
npm install
npm run deploy
Publish on Heroku and I have the same error without changing anything on the code.
The reason it doesn't work on heroku is because there isn't any production server ready in this project for your deployment as specified here : https://github.com/davezuko/react-redux-starter-kit#deployment
When you run the npm run deploy command, all the front-end code is compiled in the /dist folder.
In order to deploy it on heroku you need to :
Create a very simple http server always serving the file index.html. Here is the main part using Express or Koa
app.get('/', function(req, res) {
res.sendFile(path.join(__dirname + '/dist/index.html'));
});
Modifying the npm start script in order to target this new production ready server.
I know this may seem like a duplicate to these:
Try reinstalling `node-sass` on node 0.12?
And
how to uninstall npm modules in node js?
The environment for our team is as follows:
<bitbucket git repo>
/sourcetree\
<local windows/mac machines>
\rsync to server/
<ubuntu 14.04 dev server>
<vhost for each dev via proxy pass to rel. port>
We prefer to handle all the modules via a package.json file, easier to setup a new dev machine.. just a simple npm install.
The problem is this.. when node-sass is pulled down to a local windows machine via npm install then synced down to the dev server we keep getting the error:
Error: libsass bindings not found. Try reinstalling node-sass
But then when the module is rebuilt on the server all is fine :s. As, run on the ubuntu server:
npm rebuild node-sass
But then obv. when the fileset from a dev machine is synced to the server this wipes the rebuilt files and we are back at the error again.
When we try to run the rebuild at the local machine before syncing to the server this does not fix anything.
Although we can exclude the node-sass in the rsync command this means we then have inconsistencies when setting up a dev machine.
I found a work around, instead of using node-sass I found node-sass-middleware.
https://github.com/sass/node-sass-middleware
app.use('/css', sassMiddleware({
src: __dirname + '/sass',
dest: __dirname + '/public/css',
debug: true,
outputStyle: 'expanded' /*'compressed',*/
}));
But i still required to run
npm rebuild node-sass
And add an --exclude flag to the rsync command which prevented the node-sass directory from within the node middleware module from messing with whatever npm rebuild actually did.