why babel stores .babel.json in USERPROFILE path - node.js

I'm running a nodejs app on azure web apps and i'm trying to integrate babel using npm in it. The problem is that babel is trying to acccess a file at
%USERPROFILE%
named .babel.json, a file that doesn't exist. This is most likely installed by:
npm install -g babel
On azure web apps, i can't seem to find it at all (even after running npm install -g babel in kudu for the site).
I copied the file in %USERPROFILE% myself to %USERPROFILE% using kudu but on web app restart the file disappears.
Is there a way to make babel work on web apps?
UPDATE
I did omit some things. The error appeared when i tried load babel/register.
require('babel/register')({
optional: ["es7.asyncFunctions"]
});
and the actual error i see in the streaming logs is
Application has thrown an uncaught exception and is terminated: Error:
ENOENT, no such file or directory 'D:\local\UserProfile.babel.json'
at Object.fs.openSync (fs.js:438:18)
at Object.fs.writeFileSync (fs.js:977:15)
at save (D:\home\site\wwwroot\node_modules\babel\node_modules\babel-core\lib\api\register\cache.js:35:19)
at process._tickCallback (node.js:419:13)
at Function.Module.runMain (module.js:499:11)
at startup (node.js:119:16)
at node.js:906:3
the project is on Github

I had this same problem, solved it by disabling the babel cache by setting the environment variable BABEL_DISABLE_CACHE=1 in my Application settings.
You can read more about the babel cache here:
https://babeljs.io/docs/usage/require/#environment-variables

You change the store location of .babel.json by BABEL_CACHE_PATH
I think its better than disable caching
BABEL_CACHE_PATH=any_writable_and_exist_dir/babel.cache.json

The error appeared when i tried load babel/register.
Please check the Cache.js at (..\node_modules\babel\node_modules\babel-core\lib\api\register\Cache.js) to see if there is any babel cache path definition, e.g.
process.env.BABEL_CACHE_PATH || _path2["default"].join(_homeOrTmp2["default"], ".babel.json");
If you leverage this kind of variables, it's needed to have BABEL_CACHE_PATH app setting key and value of ./cache otherwise anything with babel wouldn't work on azure. Please refer to http://blog.syntaxc4.net/post/2012/07/26/accessing-app-settings-configured-in-microsoft-azure-web-sites-using-php-and-node-js.aspx in case you wanna know the details of accessing app settings in Azure web site using node.js.
Should you have any further concern, please feel free to let us know.

I create a nodejs app from Azure Gallery "Node JS Empty Web app" and run the command npm install -g babel in Kudu. I tried to reproduct your issue, but failed that the babel is not trying to access the file .babel.json at %USERPROFILE%.
On Azure, the npm global modules will be installed into the path "D:\local\AppData". When you restart the WebApp, the node global modules will be deleted.
If you have to use the node global modules, you can configure a startup task for a node web role to install node modules when web role start up in Cloud Service. Please refer to https://azure.microsoft.com/en-us/documentation/articles/cloud-services-startup-tasks/.
Normally, installed node modules by using npm install <module-name> at the path "wwwroot" of Kudu Debug Console on Azure Web Apps.
I tried to install the babel module at the path "wwwroot" and run the command node_module\.bin\babel, and write a file include the code require('babel') to run it successfully. It works fine.
Best Regards.

Related

How to deploy Nuxt.js to Elastic Beanstalk?

I am very new to AWS and i have been following the tutorials out there but couldn't find the answer. So, what i did was i created simple nuxt application, no changes to the framework's script or anything. I set my elastic beanstalk to run node.js settings. and then i tried to deploy my /dist folder(using nuxt build) with the application's json folder as told by every tutorials. but it gives me this this is what it looks on my webpage
I think i have something wrong with which folders i deploy or do i have to actually deploy via the aws CLI, would that make a difference at all?
eb log :
-------------------------------------
/var/log/nodejs/nodejs.log
-------------------------------------
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.
npm ERR! A complete log of this run can be found in:
npm ERR! /tmp/.npm/_logs/2019-09-29T16_00_28_939Z-debug.log
> portfolio#1.0.0 start /var/app/current
> cross-env NODE_ENV=production node server/index.js
internal/modules/cjs/loader.js:638
throw err;
^
Error: Cannot find module '/var/app/current/server/index.js'
at Function.Module._resolveFilename (internal/modules/cjs/loader.js:636:15)
at Function.Module._load (internal/modules/cjs/loader.js:562:25)
at Function.Module.runMain (internal/modules/cjs/loader.js:831:12)
at startup (internal/bootstrap/node.js:283:19)
at bootstrapNodeJSCore (internal/bootstrap/node.js:622:3)
The nodejs logs indicate to me that there is an issue with the build, an issue with how it's zipped, or an issue with your start command.
The most common is incorrectly zipping source files
When you create a ZIP file in Mac OS X Finder or Windows Explorer, make sure you zip the files and subfolders themselves, rather than zipping the parent folder.
In other words, do not right click the dist folder and click "zip", select all the files and folders (including hidden ones) and zip those. Elastic beanstalk, and many other AWS services, expect the zip to unpack into a flat structure, and not contain the parent folder when unzipped.
If this does not solve your problem, make sure you're zipping the correct folder. Try deleting your .nuxt and /dist folders, and running npm run build locally. The folder that is produced (defaults to .nuxt) is the folder whose contents need to be zipped.
The reason it is throwing that error is because your launch command starts with cross-env. When it sees that it tries to run the globally installed package cross-env but it is not available globally, so it throws that error. There are a few possible ways to address this:
The easiest is to just change the start command to use a relative path to the locally installed version of cross-env, so your command should look something like this:
node_modules/cross-env/src/bin/cross-env.js node server/index.js
You might also try adding npx to the front of your command, like so:
npx cross-env NODE_ENV=production node server/index.js
This should work but I have found that sometimes I get errors with specific packages, from what I can tell it is a bug with npx but I haven't had time to look into it. Notably I did see this bug with a nuxt js app specifically so you might too, however I was using the nuxt cli which you are not.
The third option is you could look into installing the package globally using ebextensions. In my work I haven't come across a situation where that has been necessary.

Node package dependencies on IBM Cloud Foundry - require/module is not defined (Package not loading)

I am working on an application via the toolchain tool on IBM Cloud and editing the code via the Eclipse Orion IDE. As I am not accessing this through my local cli, my understanding is that in order to so call npm install {package}, I would just need to include the package in the package.json file under dependencies and require it in my app. However, when I load the application, I get the require is not defined indicating that the package has not been installed. Moreover, the require() is being used in the app.js file with the application being launched but not from files in my public directory.
After playing around further, it seems it might have to do with the way the directory tree is being traced as the error is only thrown in subdirectories. For example, require('express') works in app.js which is in the main directory ./ but fails when it is called in test.js in ./subdirectory/test.js. I feel like I'm missing something painfully simple like configuration of endpoint or something.
I've been searching around but I can't seem to find how to get the packages loaded, preferably without using the cli. Appreciate any pointers. Thanks!
Update: After playing around further, I am also getting module is not defined error when trying to require from another file in the same directory. For example module.exports = 'str' returns this error. While trying to require('./file') returns the require is not defined. It might have to do with how node is wrapping the functions?
Update 2: Tried "start": "npm install && node app.js" in package.json but no luck. Adding a build stage which calls npm install before deployment also does not work
Update 3: After adding npm install build stage, I am able to see that the dependencies have been successfully built via the logs. However, the require is not defined error still persists.
Update 4: Trying npm install from my CLI doesn't work as well even though all packages and dependencies are present
Update 5: Running cf restage or configuring cache via cacheDirectories does not work as well
Opened a related question regarding deployment here
Found out my confusion was caused due to me not realizing that require() cannot be used on the client side unless via tools such as Browserify.

Express app with Node-sass on Azure App Service

I have a basic node web application using express that has a dependency on the node-sass library.
This is being built on a Win64 server, so during the npm install part of the build it is downloading the x64 version of the binding binary due to the current environment.
When its deployed to Azure App Service it throws a runtime error due to incompatability with the node-sass binding binary, as node runs 32bit in Azure App Service...
Error: Missing binding
D:\home\site\wwwroot\node_modules\node-sass\vendor\win32-ia32-48\binding.node
Node Sass could not find a binding for your current environment:
Windows 32-bit with Node.js 6.x
Found bindings for the following environments:
- Windows 64-bit with Node.js 6.x
When i explicitly check in the 32bit binding and re-deploy i sometimes get a 502 gateway error...
502 - Web server received an invalid response while acting as a
gateway or proxy server. There is a problem with the page you are
looking for, and it cannot be displayed. When the Web server (while
acting as a gateway or proxy) contacted the upstream content server,
it received an invalid response from the content server.
and other times i simply get a 500, but it no longer writes the error to the log.
The app depends on node-sass-middleware package version 0.11 explicitly, which depends on node-sass 4.3.0.
Without any error logs i am at a dead end. Have you come across this issue before, and if so, how did you resolve it?
I leveraged Node-Sass Example App to have quick test, used local git to deploy it sample project to Azure Web Apps, which reproduced your issue.
Via the deployment log:
remote: Selected node.js version 7.4.0. Use package.json file to choose a different version.
remote: Selected npm version 4.0.5
And according the similar error message:
Found bindings for the following environments: - Windows 64-bit with Node.js 6.x
I specified the node.js version in package.json to:
"engines": {
"node": "= 6.9.1",
"npm": "> 3"
}
Then redeploy it to Azure via local git, and the sample works fine.
For your further 500 error, you can try to leverage App Service Editor to check the output of your website.
Enter the App Service Editor from Azure portal, switch to output section by clicking the show output button, then click run to start the application.
We eventually resolved this by swapping out node-sass-middleware for gulp-sass, and also adding an npm rebuild step for node-sass. The key difference here is that the css is now rendered during the build process via gulp. Running npm rebuild node-sass first would invoke the binding download to the build server (if necessary), and then a separate task would invoke a gulp task to render the css.
The remainder of our problem was due to the fact that the web.config specified app.js as the entry point, but express4 uses the bin/www file, and simply references app.js. The problem with bin/www being the entry point is that iisnode now uses bin as the working directory, which caused issues with root relative references.
Rather than waste any more time trying to figure out if we could configure a different working directory, we simply moved bin/www to ./server.js and changed the web.config to point to server.js
The express app now runs as expected on azure websites.

Azure and node js __dirname

Probably it is not specifically related to webpack/memory-fs, but I am getting the RangeError: Maximum call stack size exceeded error (see below for a call stack).
I have found out, that __dirname on Azure (webapp) returns \\100.78.172.13\volume-7-default\8f5ecde749dace2bb57a\4e07195f015b45ce8e9ba255dc901988\site\repository\Source\Website\Content\app\node_modules\webpack\node_modules\memory-fs\lib\normalize.js in my situation, while process.cwd() returns D:\home\site\repository\Source\Website\Content\app.
Is anything can be done from my side to configure node js to return D:\... instead of \\.. ?
Gist
How to reproduce:
Clone the https://github.com/intellismiths/webapp1 repository.
Create new Azure Web App (default settings).
Configure deployment source to use GitHub.
Click Sync. It will take 10+ minutes to complete and it will show that the deployment was successful.
Go to Application settings in Azure and change WEBSITE_NODE_DEFAULT_VERSION to 6.2.2
Go to kudu page and open powershell console.
Execute npm cache clean
Check node version by executing node -v. It should be v6.2.2
On Azure, navigate to D:\home\site\respository\src\WebApp1
Execute npm run build
In console, you should see a lot of errors which indicates that modules can not be resolved.
OPTIONAL. Test npm run build on your local machine - it should produce wwwroot/app.js without errors.
Update webpack.config.js to include context: __dirname to fix previous errors.
Execute npm run build
In console, you should see the "RangeError: Maximum call stack size exceeded" error.
Update 1
I only tried to set 6.2.2 runtime after adding the second package.json, so the project structure is not the simplest possible. Maybe just setting node to 6.2.2 breaks the build.
I could reproduce your issue following your steps. I found the key point was setting the WEBSITE_NODE_DEFAULT_VERSION to 6.2.2. And I found the webpack task worked fine if the WEBSITE_NODE_DEFAULT_VERSION was under 6.
Please downgrade the setting WEBSITE_NODE_DEFAULT_VERSION to the version under 6 e.g. 5.9.0 if your node.js modules do not need such high version.
And according the package.json of angular2 athttps://github.com/angular/angular/blob/master/package.json, it seems that the angular2 repository requires the node.js version between 5.4 and 6.
Additionally, the web application's root directory on Azure Web Apps is D:\home\site\wwwroot. So if you want to build your frontend project on Azure Web Apps, you need to locate to D:\home\site\wwwroot\wwwroot\mobile-web-app then run npm run build.
It's been fixed in master and it's proposed to be included in v6.4.0.
See: https://github.com/nodejs/node/issues/7175#issuecomment-239824532 and https://github.com/nodejs/node/pull/8070
After a long day of research, trial-and-error and various experimentation, I've found an acceptable workaround if you're not willing to downgrade to Node 5.*:
Downgrade to Node 6.1.0
Make sure to install webpack globally (with npm install -g webpack).
Just using 6.1.0 gets around the "maximum call stack size exceeded" error, but instead gave me a lot of resolve failures when running webpack from node_modules (using ./node_modules/.bin/webpack). Installing webpack globally finally got me past that.
If I understand it correctly, this whole issue with __dirname in Node >= 6.2 resolving to the UNC folder path instead of the mounted path is going to be fixed, there's an active discussion here.
I had the same issue.
Fixed it with UPGRADING npm not DOWNGRADING.
Bug is fixed in the npm versions newer than 6.5.
https://github.com/aumanjoa/chronas-community/blob/master/package.json#L48
I believe that your __dirname shows your persistant drive where the data is stored, while .cwd gives current directory from where node ran. This is because Azure runs from the Drive but files are stored at the persistent drive.
In your Gruntfile.js add
module.exports = function (grunt) {
grunt.file.setBase(__dirname);
// Code omitted
}
Refer: link

Cannot deploy node.js app on GAE

I'm having trouble deploying my node.js app to GAE.
It's a simple app that connects to my Firebase and updates a value. Just to get started.
Whenever I try to deploy the app it fails. Runs fine locally.
I deleted my project and started a fresh one, and deployed the default 'hello-world' app after downloading the zip and it worked fine.
I installed firebase on the project via the cloud shell.
Added
var Firebase = require("firebase");
to the app.js file and it no longer deploys.
I am new to GAE and cannot understand why it won't deploy. I feel like if i'm having trouble just including firebase in an app, I'm in for a tough time.
This is the error I get. The only think I have added to the original hello-world app is the firebase dependency. I remove that and it deploys fine again.
Updating service [default]...failed.
ERROR: (gcloud.preview.app.deploy) Error Response: [13] Timed out when starting VMs. It's possible that the application code is unhealthy. (0/2 ready, 2 still deploying).
Any help would be greatly appreciated.
I fixed the issue by installing the firebase npm on my local machine again. I noticed when I was installing it on the server (even with --save) it wasn't updating the package.json file for some reason and it hadn't updated it locally either. But it still ran on my local machine without the package mentioning a firebase dependency. Not sure why that would be the case.
It seems to be working now.
Before you can require the "firebase" package you need to install it.
To install the latest version of the package using the command line:
Navigate to the project root directory
Run npm install --save firebase
You will now have Firebase, and all the packages that it depends on, installed in your app.
The --save argument makes the command save the package installation configuration to the package.json file, so that the package is installed when you run the npm install command to set up the project on another computer, or when your app is deployed to Google App Engine.
You can check the logs for error. To check it goto your project at google console (console.cloud.google.com) and then Menu-> Logs.
Usually this error comes when app couldn't start while deploying. 1st check if the app local environment. If it is working fine then check if any environment variable is required to set and not set properly on cloud.

Resources