Not able to browse loopback api after deploying to now.sh - node.js

I have created a loopback API and deployed it on now.sh.
After deploying I'm able to browse the directory but not able to call API URLs. My project structure is as follow:
Package.json file:
{
"name": "****",
"version": "1.0.0",
"main": "server/server.js",
"engines": {
"node": ">=6"
},
"now":{
"name":"****",
"alias":["****"],
"env":{
"MONGODB_URL":"#lbmongonew",
"NODE_ENV":"production"
}
},
"scripts": {
"lint": "eslint .",
"now:deploy":"now",
"now:alias":"now alias",
"now":"npm run now:deploy && npm run now:alias",
"posttest": "npm run lint && nsp check",
"start": "node ."
},
"dependencies": {
"compression": "^1.0.3",
"cors": "^2.5.2",
"helmet": "^3.10.0",
"loopback": "^3.22.0",
"loopback-boot": "^2.6.5",
"loopback-component-explorer": "^6.2.0",
"loopback-connector-mongodb": "^4.0.0",
"now": "^13.1.2",
"serve-favicon": "^2.0.1",
"strong-error-handler": "^3.0.0",
"todo": "^1.1.0"
},
"devDependencies": {
"eslint": "^3.17.1",
"eslint-config-loopback": "^8.0.0"
},
"repository": {
"type": "",
"url": ""
},
"license": "UNLICENSED",
"description": "****"}
My config.production.json file is as follow:
{
"restApiRoot": "/api",
"host": "0.0.0.0",
"port": 3000,
"remoting": {
"context": false,
"rest": {
"handleErrors": false,
"normalizeHttpPath": false,
"xml": false
},
"json": {
"strict": false,
"limit": "100kb"
},
"urlencoded": {
"extended": true,
"limit": "100kb"
},
"cors": false
}}
Note: I have not changed host and port because the host is a dynamic host for deployment that keeps on changing on every deployment on now.sh
here it is the directory which I'm able to browse after deployment
When I browse "https://URL/explorer" than Page not found error is occuring.
What I'm missing here while browsing APIs?

Are you using a now v2? If so, you need to use a Node Builder in your now.json or package.json before deploying.
https://zeit.co/docs/v2/deployments/official-builders/node-js-now-node/

Related

Can't deploy Node.js project to Vercel - 404: NOT_FOUND

I added valid Environment Variables (PORT and Database URI) to Vercel.
When searching I found that whole project must be wrapped in "api" folder so i did it.
This is my configuration. I added everything I found. Am I missing something or i added something wrong?.
vercel.json
{
"version": 2,
"builds": [
{
"src": "./api/index.ts",
"use": "#vercel/node"
}
],
"routes": [
{
"src": "/(.*)",
"dest": "./api/index.ts"
}
]
}
package.json
{
"name": "back-app",
"version": "1.0.0",
"description": "",
"main": "index.js",
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1",
"start": "nodemon api/index.ts"
},
"engines": {
"node": "16.x"
},
"author": "",
"license": "ISC",
"devDependencies": {
"#types/express": "^4.17.16",
"#types/mongoose": "^5.11.97",
"#types/node": "^18.11.18",
"#types/nodemon": "^1.19.2",
"nodemon": "^2.0.20",
"typescript": "^4.9.5"
},
"dependencies": {
"body-parser": "^1.20.1",
"dotenv": "^16.0.3",
"express": "^4.18.2",
"mongoose": "^6.9.1"
}
}
Vercel 404 Page`
I tried to deploy my app on vercel

When trying to publish the extension, receive error: Part URI is not valid per rules defined in the Open Packaging Conventions specification

I'm trying to publish an extension by vsce, I logged in with the user access token,
after the build its create a file named 'NadavShaked.my-first-extension v1.0.968.vsix'
I'm trying to publish the extension to the marketplace by this command 'vsce publish' and received this error:
this is the guide I used
https://code.visualstudio.com/api/working-with-extensions/publishing-extension
this is my azure-devops-extension.json file:
{
"manifestVersion": 1,
"id": "my-first-extension",
"publisher": "NadavShaked",
"version": "1.0.968",
"name": "my-first-extension",
"description": "Azure DevOps Extension",
"categories": [
"Azure Repos",
"Azure Boards",
"Azure Pipelines",
"Azure Test Plans",
"Azure Artifacts"
],
"targets": [ {
"id": "Microsoft.VisualStudio.Services"
} ],
"icons": {
"default": "logo.png"
},
"content": {
"details": {
"path": "overview.md"
}
},
"files": [ {
"path": "dist",
"addressable": true
} ]
}
this is my package.json file:
{
"id": "my-first-extension",
"name": "my-first-extension",
"publisher": "NadavShaked",
"version": "1.0.968",
"description": "Azure DevOps Extension",
"keywords": [
"extensions",
"Azure DevOps",
"Visual Studio Team Services"
],
"engines": {
"vscode": "^1.8.0"
},
"license": "MIT",
"repository": {
"type": "git",
"url": ""
},
"scripts": {
"clean": "rimraf ./dist",
"compile": "npm run clean && npm run test && webpack --mode production",
"compile:dev": "npm run clean && npm run test && webpack --mode development",
"build": "npm run compile",
"build:dev": "npm run compile:dev && npm run postbuild",
"postbuild": "npm run package-extension -- --rev-version",
"package-extension": "tfx extension create --manifest-globs azure-devops-extension.json src/Samples/**/*.json",
"publish-extension": "tfx extension publish --manifest-globs azure-devops-extension.json src/Samples/**/*.json",
"test": "set TEST_REPORT_FILENAME=test-results.xml && jest --verbose"
},
"dependencies": {
"#fluentui/react": "^8.36.3",
"azure-devops-extension-api": "~1.157.0",
"azure-devops-extension-sdk": "~2.0.11",
"azure-devops-ui": "~2.164.0",
"react": "~16.13.1",
"react-dom": "~16.13.1"
},
"devDependencies": {
"#testing-library/jest-dom": "^5.11.0",
"#testing-library/react": "^10.4.4",
"#types/jest": "^26.0.3",
"#types/react": "~16.8.2",
"#types/react-dom": "~16.8.0",
"copy-webpack-plugin": "^7.0.0",
"base64-inline-loader": "~1.1.1",
"css-loader": "~1.0.0",
"jest": "^26.1.0",
"jest-junit-reporter": "^1.1.0",
"node-sass": "^5.0.0",
"rimraf": "~2.6.2",
"sass-loader": "~10.0.5",
"style-loader": "~0.23.1",
"tfx-cli": "^0.6.3",
"ts-jest": "^26.1.1",
"ts-loader": "~5.2.2",
"typescript": "^3.9.6",
"webpack": "^5.23.0",
"webpack-cli": "^4.5.0"
},
"jest": {
"transform": {
"^.+\\.(js|ts|tsx|jsx)$": "ts-jest"
},
"transformIgnorePatterns": [
"node_modules/(?!(react-native|azure-devops-ui|azure-devops-extension-sdk)/)"
],
"moduleNameMapper": {
"\\.(jpg|jpeg|png|gif|eot|otf|webp|svg|ttf|woff|woff2|mp4|webm|wav|mp3|m4a|aac|oga)$": "<rootDir>/src/__mocks__/fileMock.js",
"\\.(css|less|scss)$": "<rootDir>/src/__mocks__/styleMock.js"
},
"preset": "ts-jest/presets/js-with-babel",
"testResultsProcessor": "./node_modules/jest-junit-reporter",
"collectCoverage": true,
"coverageReporters": [
"json",
"html",
"cobertura"
],
"globals": {
"ts-jest": {
"tsconfig": "tsconfig.test.json"
}
}
}
}
I upload the project to git my repo:
https://github.com/NadavShaked/vstsExtension/tree/master/vsts%20extension
this is the extension by run: 'vsce package'
https://easyupload.io/skwmep
this is the extension by run: 'npm run build'
https://easyupload.io/kzopux
I prefer to publish the second extension (npm run build command)
vsce is not the right command to publish to Azure devops.
In my package.json, I used npm run publish-extension or better npm run package-extension and published it by hand.

Git Bash and webpack

Hello guys I'm trying to learn Webpack I've been following some tutorials and I've run into some problems. I've installed webpack locally in folder I am working in with npm install webpack --save-dev. I made two JS scripts and I wanted to bundle them and I've tried following command webpack script-1.js /.bundle.js in WindowsPowerShell (I'm using Windows 7). Now this made the following error
webpack is not recognized as an internal or external command operable program or batch file
So then I installed webpack globally, and when I used the same command in PowerShell (I have opened it as an admin), it made bundle.js file but not in the directory I was working in, but in C:
Now after this failure I've decided to try using git bash. First I've tried this command webpack script-1.js /.bundle.js and got the following error
bash: webpack: command not found
Finally after some trying I was able to make it work using this command in git bash node_modules/.bin/webpack ./script-1.js bundle.js
Is there a way to fix this, so I can just type webpack instead of whole path ? Also is there a way to fix path in PowerShell ?
This is mine package.json
{
"name": "webpack-playlist",
"version": "1.0.0",
"description": "",
"main": "index.js",
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1"
},
"repository": {
"type": "git",
"url": "git+https://github.com/iamshaunjp/webpack-playlist.git"
},
"author": "me",
"license": "MIT",
"bugs": {
"url": "https://github.com/iamshaunjp/webpack-playlist/issues"
},
"homepage": "https://github.com/iamshaunjp/webpack-playlist#readme",
"devDependencies": {
"webpack": "^2.3.3"
}
}
and this is package.json located in node_modules/webpack/package.json
{
"_args": [
[
{
"raw": "webpack",
"scope": null,
"escapedName": "webpack",
"name": "webpack",
"rawSpec": "",
"spec": "latest",
"type": "tag"
},
"C:\\Users\\Djole\\Desktop\\NetNinja\\webpack-playlist"
]
],
"_from": "webpack#latest",
"_id": "webpack#2.3.3",
"_inCache": true,
"_location": "/webpack",
"_nodeVersion": "7.4.0",
"_npmOperationalInternal": {
"host": "packages-12-west.internal.npmjs.com",
"tmp": "tmp/webpack-2.3.3.tgz_1491205859622_0.6350918470416218"
},
"_npmUser": {
"name": "sokra",
"email": "tobias.koppers#googlemail.com"
},
"_npmVersion": "4.0.5",
"_phantomChildren": {},
"_requested": {
"raw": "webpack",
"scope": null,
"escapedName": "webpack",
"name": "webpack",
"rawSpec": "",
"spec": "latest",
"type": "tag"
},
"_requiredBy": [
"#DEV:/",
"#USER"
],
"_resolved": "https://registry.npmjs.org/webpack/-/webpack-2.3.3.tgz",
"_shasum": "eecc083c18fb7bf958ea4f40b57a6640c5a0cc78",
"_shrinkwrap": null,
"_spec": "webpack",
"_where": "C:\\Users\\Djole\\Desktop\\NetNinja\\webpack-playlist",
"author": {
"name": "Tobias Koppers #sokra"
},
"bin": {
"webpack": "./bin/webpack.js"
},
"bugs": {
"url": "https://github.com/webpack/webpack/issues"
},
"dependencies": {
"acorn": "^4.0.4",
"acorn-dynamic-import": "^2.0.0",
"ajv": "^4.7.0",
"ajv-keywords": "^1.1.1",
"async": "^2.1.2",
"enhanced-resolve": "^3.0.0",
"interpret": "^1.0.0",
"json-loader": "^0.5.4",
"loader-runner": "^2.3.0",
"loader-utils": "^0.2.16",
"memory-fs": "~0.4.1",
"mkdirp": "~0.5.0",
"node-libs-browser": "^2.0.0",
"source-map": "^0.5.3",
"supports-color": "^3.1.0",
"tapable": "~0.2.5",
"uglify-js": "^2.8.5",
"watchpack": "^1.3.1",
"webpack-sources": "^0.2.3",
"yargs": "^6.0.0"
},
"description": "Packs CommonJs/AMD modules for the browser. Allows to split your codebase into multiple bundles, which can be loaded on demand. Support loaders to preprocess files, i.e. json, jsx, es7, css, less, ... and your custom stuff.",
"devDependencies": {
"beautify-lint": "^1.0.3",
"benchmark": "^2.1.1",
"bundle-loader": "~0.5.0",
"codacy-coverage": "^2.0.1",
"codecov.io": "^0.1.2",
"coffee-loader": "~0.7.1",
"coffee-script": "^1.10.0",
"coveralls": "^2.11.2",
"css-loader": "~0.25.0",
"es6-promise-polyfill": "^1.1.1",
"eslint": "3.12.2",
"eslint-plugin-node": "^3.0.5",
"express": "~4.13.1",
"extract-text-webpack-plugin": "^2.0.0-beta",
"file-loader": "~0.9.0",
"i18n-webpack-plugin": "^0.3.0",
"istanbul": "^0.4.5",
"jade": "^1.11.0",
"jade-loader": "~0.8.0",
"js-beautify": "^1.5.10",
"less": "^2.5.1",
"less-loader": "^2.0.0",
"lodash": "^4.17.4",
"mocha": "^3.2.0",
"mocha-lcov-reporter": "^1.0.0",
"nsp": "^2.6.1",
"raw-loader": "~0.5.0",
"react": "^15.2.1",
"react-dom": "^15.2.1",
"script-loader": "~0.7.0",
"should": "^11.1.1",
"simple-git": "^1.65.0",
"sinon": "^1.17.7",
"style-loader": "~0.13.0",
"url-loader": "~0.5.0",
"val-loader": "~0.5.0",
"vm-browserify": "~0.0.0",
"webpack-dev-middleware": "^1.9.0",
"worker-loader": "~0.7.0"
},
"directories": {},
"dist": {
"shasum": "eecc083c18fb7bf958ea4f40b57a6640c5a0cc78",
"tarball": "https://registry.npmjs.org/webpack/-/webpack-2.3.3.tgz"
},
"engines": {
"node": ">=4.3.0 <5.0.0 || >=5.10"
},
"files": [
"lib/",
"bin/",
"buildin/",
"hot/",
"web_modules/",
"schemas/"
],
"gitHead": "ba24c1b163dc038ed738eb4a57dcb241bf63146d",
"homepage": "https://github.com/webpack/webpack",
"license": "MIT",
"main": "lib/webpack.js",
"maintainers": [
{
"name": "jhnns",
"email": "mail#johannesewald.de"
},
{
"name": "sokra",
"email": "tobias.koppers#googlemail.com"
},
{
"name": "thelarkinn",
"email": "sean.larkin#cuw.edu"
}
],
"name": "webpack",
"optionalDependencies": {},
"readme": "ERROR: No README data found!",
"repository": {
"type": "git",
"url": "git+https://github.com/webpack/webpack.git"
},
"scripts": {
"appveyor:benchmark": "npm run benchmark",
"appveyor:test": "node --max_old_space_size=4096 node_modules\\mocha\\bin\\mocha --harmony test/*.test.js",
"beautify-lint": "beautify-lint 'lib/**/*.js' 'hot/**/*.js' 'bin/**/*.js' 'benchmark/*.js' 'test/*.js'",
"benchmark": "mocha test/*.benchmark.js --harmony -R spec",
"build:examples": "cd examples && node buildAll.js",
"cover": "node --harmony ./node_modules/istanbul/lib/cli.js cover -x '**/*.runtime.js' node_modules/mocha/bin/_mocha -- test/*.test.js",
"cover:min": "node --harmony ./node_modules/.bin/istanbul cover -x '**/*.runtime.js' --report lcovonly node_modules/mocha/bin/_mocha -- test/*.test.js",
"lint": "eslint lib bin hot buildin test/**/webpack.config.js test/binCases/**/test.js examples/**/webpack.config.js",
"lint-files": "npm run lint && npm run beautify-lint",
"nsp": "nsp check --output summary",
"pretest": "npm run lint-files",
"publish-patch": "npm run lint && npm run beautify-lint && mocha && npm version patch && git push && git push --tags && npm publish",
"test": "mocha test/*.test.js --harmony --check-leaks",
"travis:benchmark": "npm run benchmark",
"travis:lint": "npm run lint-files && npm run nsp",
"travis:test": "npm run cover:min"
},
"version": "2.3.3",
"web": "lib/webpack.web.js"
}
EDIT:
I've come with following solution in the end:
Add this to your package.json file
"scripts" : {
"build" : "webpack ./entry.js bundle.js"
}
and then type npm run build this will still run the local version because npm will first look in ./node_modules/.bin/
That kind of path is what is used in a git for Windows bash.
See this issue
We use cmdr (http://cmder.net/ ) to emulate console on Windows machines.
Still we had to modify scripts and separate build to clean and build tasks to get it working.
"scripts": {
"clean": "rm -rf dist",
"build": "node_modules/.bin/babel-node -- ./node_modules/webpack/bin/webpack.js --stats --config ./webpack/prod.config.js",
...
},
You can see a similar instruction in this project package.json:
"build-main": "cross-env NODE_ENV=production node -r babel-register ./node_modules/webpack/bin/webpack --config webpack.config.electron.js --progress --profile --colors",

DEPS_RESOLVE_FAILED on module when building a web application with Brunch in ES6

I'm having an issue when building my web application using Brunch. My application depends on a module I've created and uploaded to NPM, and whenever I build it, I get:
DEPS_RESOLVE_FAILED of node_modules/rd-vue-bootstrap/dist/rd-vue-bootstrap.js failed.
Could not load module './bs-button-group.vue' from '/Users/rjuliani/dev/production-manager-ui/node_modules/rd-vue-bootstrap/dist'.
Make sure the file actually exists
The module itself builds just fine, however when I use it from my test web application and build it (the web application) it throw me the above error.
The relevant parts of my package.json file for the module are:
"main": "dist/rd-vue-bootstrap.js",
"files": [
"dist/rd-vue-bootstrap.js",
"dist/rd-vue-bootstrap.js.map",
"dist/rd-vue-bootstrap.min.js",
"src"
],
brunch-config.js
module.exports = {
files: {
javascripts: {
joinTo: 'app.js'
},
templates: {
joinTo: 'app.js'
}
},
plugins: {
babel: {
},
assetsmanager: {
copyTo: {
'vendor': ['node_modules/bootstrap', 'node_modules/jquery', 'node_modules/rd-vue-bootstrap']
},
minTimeSpanSeconds: 10 // assets won't be copied more frequent than once per X seconds.npm
}
}
};
initialize.js (main file for my web application)
import Vue from 'vue';
import RdVueBootstrap from 'rd-vue-bootstrap';
Vue.use(RdVueBootstrap);
Finally, package.json for my test web application
{
"name": "production-manager-ui",
"description": "Simple UI for the production-manager API project",
"version": "0.0.1",
"license": "MIT",
"repository": {
"type": "git",
"url": "https://github.com/radical-dreamers/production-manager-ui.git"
},
"scripts": {
"watch": "brunch watch --server",
"build": "brunch build --production"
},
"author": {
"url": "http://www.codelightsoftware.com",
"name": "Rodrigo Juliani",
"email": "srodriki#gmail.com"
},
"keywords": [
"vue",
"brunch"
],
"dependencies": {
"bootstrap": "^3.3.7",
"jquery": "^3.1.0",
"rd-vue-bootstrap": "0.0.6",
"vue": "^1.0.26",
"vue-router": "^0.7.13"
},
"devDependencies": {
"assetsmanager-brunch": "^1.8.1",
"auto-reload-brunch": "^2.7.1",
"babel-brunch": "^6.0.6",
"brunch": "^2.8.2",
"css-brunch": "^2.6.1",
"javascript-brunch": "^2.0.0",
"vue-brunch": "^1.1.2",
"vue-devtools": "^2.0.4"
}
}
Any ideas how to fix this? I've tried many things and nothing seems to be working as of right now :(
Thanks!

Using require() and import for private npm modules failing

I was trying import my private npm module hosted in sinopia. I can see that my module is available in sinopia folder structure.
Able to install module via "npm install --save". I can see it picks it from local registry.
But when I to use it anywhere I am getting "Error: Cannot find module ''
var module = require('some-module');
(tried both)
import module from 'some-module';
ERROR in ./app/index.js
Module not found: Error: Cannot resolve 'file' or 'directory' ../node_modules/test-module in c:\yotest\app
# ./app/index.js 39:34-77
P.S: I did try installing it as a global node module and it again failed.
EDIT:
This is my package.json of the private module which is a clone from the github project.
{
"_args": [
[
"react-worker-dom",
""
]
],
"_from": "react-worker-dom#latest",
"_id": "react-worker-dom#0.0.3",
"_inCache": true,
"_installable": true,
"_location": "/react-worker-dom",
"_nodeVersion": "5.7.1",
"_npmUser": {},
"_npmVersion": "3.6.0",
"_phantomChildren": {},
"_requested": {
"name": "react-worker-dom",
"raw": "react-worker-dom",
"rawSpec": "",
"scope": null,
"spec": "latest",
"type": "tag"
},
"_requiredBy": [
"#USER"
],
"_shasum": "01b520589b7fd9d5533f911108ac6e1f774dab79",
"_shrinkwrap": null,
"_spec": "react-worker-dom",
"_where": "",
"author": {
"email": "******************",
"name": "********************"
},
"bugs": {
"url": "https://github.com/web-perf/react-worker-dom/issues"
},
"dependencies": {
"invariant": "^2.2.0",
"react": "^0.14.3"
},
"description": "ReactJS renderer using Web Workers",
"devDependencies": {
"babel-core": "^6.2.1",
"babel-loader": "^6.2.0",
"babel-preset-es2015": "^6.1.18",
"babel-preset-react": "^6.1.18",
"babel-preset-stage-0": "^6.1.18",
"browser-perf": "^1.4.3",
"react-dom": "^0.14.3",
"webpack": "^1.12.8",
"webpack-dev-server": "^1.14.1"
},
"directories": {
"test": "test"
},
"dist": {
"shasum": "01b520589b7fd9d5533f911108ac6e1f774dab79",
"tarball": "http://localhost:4873/react-worker-dom/-/react-worker-dom-0.0.3.tgz"
},
"gitHead": "8c8fb15e793151e0169aac82537f4efe628d9986",
"homepage": "http://web-perf.github.io/react-worker-dom",
"license": "BSD-3-Clause",
"main": "dist/worker.js",
"name": "react-worker-dom",
"optionalDependencies": {},
"publishConfig": {
"registry": "http://localhost:4873/"
},
"readme": "ERROR: No README data found!",
"readmeFilename": "README.md",
"repository": {
"type": "git",
"url": "git+https://github.com/web-perf/react-worker-dom.git"
},
"scripts": {
"build-demo": "webpack --config test/webpack.config.js",
"demo": "webpack-dev-server --config test/webpack.config.js",
"perf": "node test/perf.js"
},
"version": "0.0.3"
}
Webpack config of main project
module.exports = {
entry: './app/index.js',
output: {
filename: 'public/bundle.js'
},
module: {
loaders: [
{
test: /\.jsx?$/,
exclude: /(node_modules|bower_components)/,
loader: 'babel'
}
]
}
}
Package.json file of the main project
{
"name": "yotest",
"version": "0.0.1",
"main": "index.js",
"scripts": {
"start": "node bin/dev-server"
},
"keywords": [
"webpack",
"redux",
"react",
"react-router",
"kyper"
],
"license": "MIT",
"dependencies": {
"babel-core": "^5.8.22",
"babel-loader": "^5.3.2",
"express": "^4.13.3",
"extract-text-webpack-plugin": "^0.8.2",
"history": "^1.9.1",
"kyper-matter": "^0.1.2",
"lodash": "^3.10.1",
"proxy-middleware": "^0.13.1",
"react": "^0.14.0-rc1",
"react-dom": "^0.14.0-rc1",
"react-hot-loader": "^1.2.8",
"react-redux": "^2.1.2",
"react-router": "^1.0.0-rc1",
"react-worker-dom": "0.0.3",
"redux": "^3.0.0",
"redux-router": "^1.0.0-beta3",
"redux-thunk": "^1.0.0"
},
"devDependencies": {
"css-loader": "^0.16.0",
"eslint": "^1.4.1",
"eslint-config-airbnb": "0.0.8",
"eslint-plugin-react": "^3.2.3",
"node-sass": "^3.3.2",
"redux-devtools": "^2.1.2",
"sass-loader": "^2.0.1",
"style-loader": "^0.12.3",
"webpack": "^1.12.2",
"webpack-dev-server": "^1.12.0"
}
}
I have reconfigured my NPM private registry and there was a port mismatch which was causing the problem.

Resources