Jovo Could not resolve “vscode” error when I try to deploy - node.js

I’m trying to deploy my Jovo project to AWS Lambda using the command: “jovo deploy:code serverless” and I get “Could not resolve “vscode” error” at various locations in the node_modules folder.
Example:
X [ERROR] Could not resolve “vscode”`
node_modules/#alexa/acdl/dist/cjs/extension.js:30:27: 30 │ const vscode = require(“vscode”);
╵ ~~~~~~~~`
You can mark the path “vscode” as external to exclude it from the bundle, ``which will remove this error. You can also surround this “require” call with a try/catch block to handle this failure at run-time instead of bundle-time.`
X [ERROR] Could not resolve “vscode”`
node_modules/vscode-languageclient/lib/node/main.js:22:25: 22 │ const vscode_1 = require(“vscode”);
╵ ~~~~~~~~`
You can mark the path “vscode” as external to exclude it from the bundle, which will remove this error. You can also surround this “require” call with a try/catch block to handle this failure at run-time instead of `bundle-time.
I used “jovo build:serverless” to build the serverless.yaml file.
Any help is appreciated.
Thanks
Package.json file content:
{
"name": "voice-controller",
"private": true,
"description": "test",
"scripts": {
"build": "babel src --out-dir dist",
"start": "node dist/app.dev.js --jovo-webhook",
"start:dev": "nodemon --watch src --exec \"babel src --out-dir dist && node dist/app.dev.js --jovo-webhook\"",
"bundle:dev": "npm run bundle -- dist/app.dev.js",
"prebundle": "rimraf bundle && babel src --out-dir dist",
"bundle": "esbuild --bundle --outfile=bundle/index.js --sourcemap --minify --keep-names --platform=node --target=node16 --format=cjs --external:aws-sdk --external:#oclif/* --external:#jovotech/cli*",
"postbundle": "cd bundle && bestzip ../bundle.zip * && cd ..",
"eslint": "eslint src test --fix",
"test": "jest -c jest.config.js"
},
"author": "jovotech",
"license": "Apache-2.0",
"dependencies": {
"#alexa/acdl": "^0.1.12",
"#jovotech/db-dynamodb": "^4.2.13",
"#jovotech/db-filedb": "^4.0.0",
"#jovotech/framework": "^4.2.15",
"#jovotech/platform-alexa": "^4.2.15",
"#jovotech/platform-googleassistant": "^4.2.13",
"#jovotech/plugin-debugger": "^4.2.14",
"#jovotech/server-express": "^4.0.0",
"#jovotech/target-serverless": "^4.1.6",
"#types/vscode": "^1.67.0",
"async": "^3.2.3",
"esbuild-windows-64": "^0.14.40",
"jovo-db-dynamodb": "^3.6.1",
"jszip": "^3.10.0",
"node-fetch": "^2.6.7",
"vscode-languageclient": "^8.0.1",
"vscode-test": "^1.6.1"
},
"devDependencies": {
"#babel/cli": "^7.14.5",
"#babel/core": "^7.14.6",
"#babel/eslint-parser": "^7.16.3",
"#babel/plugin-proposal-decorators": "^7.14.5",
"#babel/plugin-transform-runtime": "^7.14.5",
"#babel/preset-env": "^7.14.7",
"#babel/register": "^7.14.5",
"#babel/runtime": "^7.14.6",
"#jovotech/cli-command-build": "^4.1.6",
"#jovotech/cli-command-deploy": "^4.1.6",
"#jovotech/cli-command-get": "^4.1.6",
"#jovotech/cli-command-new": "^4.1.6",
"#jovotech/cli-command-run": "^4.1.7",
"#jovotech/cli-core": "^4.0.0",
"#jovotech/filebuilder": "^0.0.1",
"babel-jest": "^27.0.6",
"bestzip": "^2.2.0",
"esbuild": "^0.14.2",
"eslint": "^7.32.0",
"eslint-config-prettier": "^7.1.0",
"eslint-plugin-prettier": "^3.3.1",
"jest": "^26.6.3",
"nodemon": "^2.0.10",
"prettier": "^2.2.1",
"rimraf": "^3.0.2"
},
"repository": {
"type": "git",
"url": "git+https://github.com/jovotech/jovo-framework.git"
},
"bugs": {
"url": "https://github.com/jovotech/jovo-framework"
},
"homepage": "https://github.com/jovotech/jovo-v4-template-js/issues#readme"
}

Related

Next.js error cannot find module 'next/headers'

Faced this issue when I was using login functionality developed by my teammate in a group project and apparently I am the only one facing this issue.
npm version: 8.19.3
node version: 16.17.0
package.json :-
{
"name": "frontend",
"version": "0.1.0",
"private": true,
"scripts": {
"dev": "npm run prettify && next dev",
"build": "npm run prettify && next build",
"start": "next start",
"lint": "npm run prettify && next lint",
"prettify": "prettier --write \"**/*.{js, jsx}\""
},
"dependencies": {
"#emotion/react": "11.10.4",
"#emotion/server": "11.10.0",
"#emotion/styled": "11.10.4",
"#mui/icons-material": "5.10.6",
"#mui/material": "5.10.6",
"#mui/x-date-pickers": "^5.0.3",
"cryptr": "^6.0.3",
"dayjs": "^1.11.5",
"intl": "^1.2.5",
"mui-file-dropzone": "^4.0.2",
"next": "12.2.5",
"next-auth": "^4.12.0",
"normalize.css": "^8.0.1",
"react": "18.2.0",
"react-dom": "18.2.0",
"react-share": "^4.4.1",
"react-toastify": "^9.0.8",
"swr": "^1.3.0",
"universal-cookie": "^4.0.4"
},
"devDependencies": {
"eslint": "8.23.1",
"eslint-config-next": "12.3.1",
"eslint-config-prettier": "8.5.0",
"prettier": "2.7.1"
}
}
Error :-
error - Error: Cannot find module 'next/headers'
I have tried deleting the node_modules and .next folders but I am still facing this issue.
That is when you update Nextjs to version 13 with next-auth, which is intended for next#13 users, in your case using version 12 yet, the root cause the error in v4.12.x with next/headers package from next#12, so it could be to support getting the session in React Server Components for example.
Edit package.json, it should fix your issue:
{
"next-auth": "4.15.1"
}

Nodejs, how to deploy typescript project which reference multiple local projects to Heroku?

I have a nodejs typescript project with this package.json:
{
"name": "construction-node-service",
"version": "1.0.0",
"description": "Fine Chat App Nodejs Service",
"main": "app.js",
"types": "./#types",
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1",
"debug": "nodemon --inspect src/app.ts",
"dev:debug": "nodemon --config nodemon.json --inspect-brk src/index.ts",
"tsdebug": "ts-node-dev --respawn ",
"tsdev": "nodemon --exec ts-node tt.ts",
"compile": "tsc && node dist/app.js",
"dev": "nodemon -e ts --exec npm run compile",
"dev:server": "nodemon --watch ./**/*.ts --exec ts-node src/app.ts",
"start": "node dist/app.js"
},
"engines": {
"node": "12.22.1"
},
"author": "Ayman Shokry",
"license": "ISC",
"dependencies": {
"#types/compression": "^1.7.0",
"bson-objectid": "^2.0.1",
"compression": "^1.7.4",
"express": "^4.17.1",
"generate-unique-id": "^2.0.1",
"global-shared-node": "file:../../../public-api/NodeJs/global-shared-node",
"public-dao-node": "file:../../../public-api/NodeJs/public-dao-node",
"helmet": "^4.6.0",
"moment": "^2.29.1",
"mongoose": "^5.12.1",
"multer": "^1.4.2",
"mysql2": "^2.1.0",
"reflect-metadata": "^0.1.13",
"sequelize": "^6.6.2",
"sequelize-typescript": "^2.1.0",
"socket.io": "^2.3.0"
},
"devDependencies": {
"#types/express": "^4.17.11",
"#types/node": "^15.0.1",
"#types/sequelize": "^4.28.9",
"#types/validator": "^13.1.3",
"babel-cli": "^6.26.0",
"babel-preset-es2015": "^6.24.1",
"pm2": "^4.5.0",
"rimraf": "^3.0.2",
"sequelize-cli": "^5.5.1",
"ts-node": "^9.1.1",
"ts-node-dev": "^1.1.6",
"typescript": "^4.2.4"
}
}
I thought if I can copy the 2 local project src files to my project src folder before deploy but I think this solution is annoying
as you see I referenced 2 local projects on my HDD the question is how can I deploy this project with the 2 project dependencies to Heroku.thanks
As per the questions and suggestions on the internet, the answer is NO.
According to many communities and experts, Heroku's model is to run one app per dyno (and often many dynos for a single app).
But wait, there is a case in which two servers are deployed to a single dyno and it worked too. You can check it here: https://medium.com/#nadayar/heroku-fu-multiple-servers-on-one-dyno-6fc68d57b373
Hope this solves your problem!

Babel don't compile .graphql files inside the build folder on "babel server --out-dir build"

Some introduction:
Our app uses Heroku as a server.
So, after pushing code it runs npm start as in my package.json
My current version of nodeJS in a laptop: v8.16.2, npm: 6.4.1.
In package.json:
"engines": {
"node": "10.16.3",
"npm": "6.9.0"
},
The problem:
Currently, it runs like this "start": "node build/index.js"
. Last changes were about adding graphql files.
npm start show Error: ENOENT: no such file or directory, open '/app/build/apollo/nCourse/nCourse.graphql'
We don't run with node server/index.js because of using new ecma script features(not common js) like import and export
The question
I see two solutions in this problem
Make something which will create the file with graphql extension in build folder
Maybe update version of nodeJS if it can understand es import and export
Package.json
{
"name": "wunder-education",
"version": "1.0.0",
"description": "",
"main": "index.js",
"engines": {
"node": "10.16.3",
"npm": "6.9.0"
},
"scripts": {
"start": "node build/index.js",
"server": "nodemon --exec babel-node server/index.js",
"server:prodDB": "MONGO_URL=mongodb://saturdaykids:52turdayk1ds3#ds117866.mlab.com:17866/saturdaykids-prod nodemon --exec babel-node server/index.js",
"clean": "rm -rf node_modules",
"clean:admin": "npm run clean --prefix admin",
"clean:all": "concurrently \"npm run clean\" \"npm run clean:admin\"",
"install:admin": "npm install --prefix admin",
"admin": "npm run start --prefix admin",
"build:admin": "npm run build --prefix admin",
"build:server": "babel server --out-dir build",
"build": "concurrently \"npm run build:server\" \"npm run build:admin\"",
"dev": "concurrently \"npm run server\" \"npm run admin\"",
"postinstall": "npm run install:admin",
"heroku-postbuild": "npm run build",
"format:server": "prettier --write server/**/**/**/*.js",
"format:admin": "prettier --write admin/src/**/**/*.js"
},
"author": "",
"license": "ISC",
"dependencies": {
"#apollo/react-hooks": "^3.1.3",
"#babel/cli": "^7.0.0",
"#babel/core": "^7.0.0",
"#babel/node": "^7.2.2",
"#babel/plugin-transform-runtime": "^7.7.4",
"#babel/preset-env": "^7.0.0",
"#babel/runtime": "^7.3.1",
"#badgeup/badgeup-node-client": "^2.0.3",
"airtable": "^0.5.10",
"apollo-boost": "^0.4.4",
"apollo-server-express": "^2.9.13",
"aws-sdk": "^2.456.0",
"babel-plugin-module-resolver": "^3.1.1",
"body-parser": "^1.18.3",
"chalk": "^2.4.1",
"concurrently": "^3.5.1",
"connect-mongo": "^2.0.1",
"cors": "^2.8.5",
"express": "^4.16.3",
"express-force-https": "^1.0.0",
"express-jwt": "^5.3.1",
"express-session": "^1.15.6",
"express-validator": "^5.3.1",
"graphql": "^14.5.8",
"jsonwebtoken": "^8.4.0",
"lodash": "^4.17.15",
"mongoose": "^5.1.2",
"mongoose-fill": "^1.7.0",
"mongoose-paginate": "^5.0.3",
"multer": "^1.4.1",
"multer-s3": "^2.9.0",
"nan": "^2.14.0",
"nodemon": "^1.17.5",
"passport": "^0.4.0",
"passport-jwt": "^4.0.0",
"passport-local": "^1.0.0",
"passport-local-mongoose": "^5.0.1",
"request": "^2.87.0",
"socket.io": "^2.1.1",
"socket.io-client": "^2.2.0",
"supertest": "^3.4.2"
},
"devDependencies": {
"babel-eslint": "^10.0.3",
"eslint": "^6.4.0",
"eslint-config-airbnb": "^16.1.0",
"eslint-config-prettier": "^6.7.0",
"eslint-import-resolver-babel-module": "^5.1.0",
"eslint-plugin-import": "^2.14.0",
"eslint-plugin-jsx-a11y": "^6.2.3",
"eslint-plugin-prettier": "^3.1.1",
"eslint-plugin-react": "^7.17.0",
"prettier": "^1.16.4"
}
}
Using rsync was my choice too.
I used it slightly differently like so:
"script": {
...
"rsync:graphql": "rsync -r --include '*/' --include '*.graphql' --exclude='*' --prune-empty-dirs 'src/' 'dist/'",
"build": "BABEL_ENV=build babel src -d dist --source-maps --no-comments && npm run rsync:graphql",
...
}
In short, it saying: recursively copy all .graphql files from the src directory to the dist directory and follow the same folders structure.
rsync is basically a powerful transfer files utility for Unix-like operating systems. You might have it shipped with your OS system.
In my case, I needed to install it in my CI/CD pipeline (CircleCi) and added to my Dockerfile commands.
Hope it helps! Will be happy to hear about other solutions.
EDIT:
You can also watch for changes made in any .graphql files by adding the following to your nodemonConfig in your package.json:
"nodemonConfig": {
"ext": "env,js,graphql,json",
"watch": [
".env",
"./src"
],
}
Finally it solved by copy and pasting .graphql files inside the build/apollo by this command
rsync -a --prune-empty-dirs --include 'server/apollo/*' --include '*.graphql' 'server/apollo' 'build'
In package.json:
"syncGraphql": "rsync -a --prune-empty-dirs --include 'server/apollo/*' --include '*.graphql' 'server/apollo' 'build'",
"build": "concurrently \"npm run build:server\" \"npm run build:admin\" \"npm run syncGraphql\"",

When I try to use Parcel to build a production version of a React app that works fine in development mode, I get "Cannot find module 'sass'"

I've built a simple React/Redux app and am using Parcel for the bundler. It works fine in development mode, that is, using the script
"dev": "parcel ./src/index.html",
but when I tried to do
"build": "parcel build ./src/index.html",
I got the following error
/Users/abc/Documents/Projects/sandbox/smart/src/styles/main.scss: Cannot find module 'sass' from '/Users/abc/Documents/Projects/sandbox/smart/src/styles'
at /Users/abc/Documents/Projects/sandbox/smart/node_modules/resolve/lib/async.js:97:35
at processDirs (/Users/abc/Documents/Projects/sandbox/smart/node_modules/resolve/lib/async.js:244:39)
at isdir (/Users/abc/Documents/Projects/sandbox/smart/node_modules/resolve/lib/async.js:251:32)
at /Users/abc/Documents/Projects/sandbox/smart/node_modules/resolve/lib/async.js:23:69
at FSReqWrap.oncomplete (fs.js:152:21)
This is the first time I've tried to build an app using Parcel and I'm lost. I'm using node-sass to import my sass files directly -- perhaps this has something to do with that.
The referenced file (main.scss) is referenced in App.js like this
import "../../styles/main.scss";
and is the first sass file to be included (App is loaded into the DOM like this in index.js:
const store = configureStore()
ReactDOM.render(
<Provider store={store}>
<App />
</Provider>,
document.getElementById("root")
)
This is running under Node 11.15. My package.json follows -- any hints or help much appreciated!
{
"name": "friender",
"version": "1.0.0",
"description": "",
"main": "index.js",
"jest": {
"setupFiles": ["jest-localstorage-mock"]
},
"scripts": {
"dev": "parcel ./src/index.html",
"build": "parcel build ./src/index.html",
"lint": "eslint \"src/**/*.{js,jsx}\" --quiet",
"test": "jest"
},
"prettier": {
"semi": false
},
"keywords": [],
"author": "",
"license": "MIT",
"devDependencies": {
"#babel/cli": "^7.6.0",
"#babel/core": "^7.6.0",
"#babel/plugin-transform-runtime": "^7.5.5",
"#babel/preset-env": "^7.6.0",
"#types/jest": "^24.0.18",
"babel-eslint": "^10.0.3",
"babel-preset-react": "^7.0.0-beta.3",
"eslint": "^6.2.2",
"eslint-config-prettier": "^6.1.0",
"jest": "^24.9.0",
"jest-localstorage-mock": "^2.4.0",
"parcel-bundler": "^1.12.3",
"prettier": "^1.18.2"
},
"dependencies": {
"#emotion/babel-preset-css-prop": "^10.0.14",
"#emotion/core": "^10.0.16",
"#emotion/styled": "^10.0.15",
"#fortawesome/fontawesome-svg-core": "^1.2.0-7",
"#fortawesome/free-solid-svg-icons": "^5.11.1",
"#fortawesome/react-fontawesome": "^0.1.4",
"axios": "^0.19.0",
"bulma": "^0.7.5",
"eslint-plugin-jest": "^22.17.0",
"eslint-plugin-react": "^7.14.3",
"immer": "^4.0.0",
"node-sass": "^4.12.0",
"prop-types": "^15.7.2",
"react": "16.x",
"react-detect-offline": "^2.4.0",
"react-dom": "^16.9.0",
"react-fontawesome": "^1.6.1",
"react-modal": "^3.10.1",
"react-redux": "^7.1.1",
"redux": "^4.0.4",
"redux-devtools-extension": "^2.13.8",
"redux-thunk": "^2.3.0"
}
}
Try instead per the documentation for SCSS and error Cannot find module 'sass' use module sass instead of node-sass:
npm install -D sass
The documentation mentions being able to use node-sass, but there are several active issues with node-sass. Module sass may help resolve the error and allow you use SCSS in your application.
Hopefully that helps!

babel-node vs node: graphql files with import/exports

It appears that NodeJS does not understand import/export commands in graphql files (extension .gql), but babel-node does. The only fix I can come up with is to rename the .gql files to .js files, but I lose syntax highlighting.
Is there a simple fix to have node honor import/exports in files non-js extensions? Attached is my package.json; npm run dev works, but npm run build; npm run start does not:
{
"name": "MyAPI",
"version": "1.0.0",
"description": "MyAPI using GraphQL",
"main": "api/server.js",
"scripts": {
"build": "babel api -d src --copy-files",
"start": "node src/server.js",
"debug": "babel-node --inspect api/server.js",
"dev": "nodemon api/server.js --watch api --watch tests --ext js,gql --exec babel-node",
"lint": "eslint api,tests",
"test": "mocha --require babel-core/register tests"
},
"author": "JML",
"devDependencies": {
"apollo-client": "^2.0.2",
"apollo-client-preset": "^1.0.2",
"babel-eslint": "^7.2.1",
"babel-plugin-syntax-object-rest-spread": "^6.13.0",
"babel-plugin-transform-async-generator-functions": "^6.24.1",
"babel-plugin-transform-object-rest-spread": "^6.23.0",
"babel-plugin-transform-runtime": "^6.23.0",
"babel-preset-env": "^1.6.0",
"babel-preset-stage-3": "^6.24.1",
"chai": "^4.1.2",
"chai-subset": "^1.6.0",
"eslint": "^4.3.0",
"eslint-plugin-babel": "^4.1.2",
"graphql": "^0.10.5",
"mocha": "^4.0.1",
"node-fetch": "^1.7.3",
"nodemon": "^1.11.0",
"randexp": "^0.4.6"
},
"dependencies": {
"babel-cli": "^6.24.0",
"babel-core": "^6.25.0",
"babel-preset-latest": "^6.24.1",
"babel-runtime": "^6.26.0",
"body-parser": "^1.17.1",
"casual": "^1.5.14",
"cors": "^2.8.4",
"eslint": "^4.10.0",
"express": "^4.15.2",
"graphql-server-express": "1.0.4",
"graphql-tag": "^2.5.0",
"graphql-tools": "^1.1.0",
"lodash": "^4.17.4",
"mysql": "^2.14.1",
"nano": "^6.4.2",
"treeize": "^2.1.2"
}
}
npm install babel-cli babel-preset-env
once you installed those, it will create populated .babelrc file at the root level. you do not need to modify. then you need to load those configurations to the start script in package.json.
"start": "nodemon src/index.js --ext js,graphql --exec babel-node ",
If you do not know about nodemon, u need to install it globally and it will watch the src/index.js file.
--ext js, graphql // this is optional. it will have vscode to colorize the code.
Lastly, you need to configure babel to support object spread operator.
npm install babel-plugin-transform-object-rest-spread
then add this "transform-object-rest-spread" to the plugins array in the .babelrc file.
.babelrc
{
"presets": ["env", "react", "stage-0"],
"plugins": [
"transform-class-properties",
"transform-decorators",
"transform-react-constant-elements",
"transform-react-inline-elements",
"transform-object-rest-spread"
]
}

Resources