How do I change the entry point in a package.json? - node.js

everyone.
I'm new to node.js and front development and I'm working with this template:
https://github.com/coreui/coreui-free-bootstrap-admin-template
and I have a silly question that no one seems to address in the forums in a straightforward, simple way.
The template's entry point is the index.html. I tried to change it in the package.json to the login.html, because I want the app to open that page first, of course, but I cannot make it work. I know... It's so silly. I'm sure it's very easy to solve but all the examples I find explain the set up using webpack, and this template doesn't use it.
Could anyone give me a hint? I'll deeply appreciate it.
I copy the package.json for you:
{
"name": "#coreui/coreui-free-bootstrap-admin-template",
"version": "2.1.15",
"description": "Free Bootstrap Admin Template",
"keywords": [
"admin",
"admin panel",
"admin template",
"bootstrap",
"css",
"dashboard",
"framework",
"front-end",
"responsive",
"sass",
"ui kit",
"webapp"
],
"homepage": "https://coreui.io",
"bugs": {
"url": "https://github.com/coreui/coreui-free-bootstrap-admin-template/issues",
"email": "support#coreui.io"
},
"license": "MIT",
"author": {
"name": "Łukasz Holeczek",
"url": "http://holeczek.pl",
"github": "https://github.com/mrholek",
"twitter": "https://twitter.com/lukaszholeczek"
},
"contributors": [
{
"name": "Andrzej Kopański",
"url": "https://github.com/xidedix"
}
],
"main": "src/index.html",
"repository": {
"type": "git",
"url": "git+https://github.com/coreui/coreui-free-bootstrap-admin-template.git"
},
"scripts": {
"build": "npm-run-all build-clean build-copy build-vendors",
"build-clean": "rimraf dist",
"build-copy": "copyfiles -a -e \"src/scss/**/*\" -u 1 \"src/**/*\" dist/",
"build-vendors": "node build/vendors.js",
"css": "npm-run-all --parallel css-compile* --sequential css-prefix css-minify*",
"css-compile": "node-sass --output-style expanded --source-map true --source-map-contents true --precision 6 src/scss/style.scss src/css/style.css",
"css-compile-vendors": "node build/vendors-sass.js",
"css-lint": "stylelint --config build/.stylelintrc --syntax scss \"src/scss/**/*.scss\"",
"css-minify": "cleancss --level 1 --source-map --source-map-inline-sources --output src/css/style.min.css src/css/style.css",
"css-prefix": "postcss --config build/postcss.config.js --replace \"src/css/*.css\" \"!src/css/*.min.css\"",
"js": "npm-run-all --parallel js-compile* js-lint*",
"js-compile": "cross-env PLUGINS=true babel src/js/src/ --out-dir src/js/ --source-maps",
"js-lint": "eslint src/js/src",
"localhost": "browser-sync start --server \"./src\" --serveStatic \"./\" --files \"!./src/js/src/**/*, ./src/**/*, !./src/scss/**/*\"",
"localhost-dist": "browser-sync start --server \"./dist\"",
"pug": "node build/pug.js",
"release-version": "node build/change-version.js",
"serve": "npm-run-all --parallel localhost watch-css watch-js",
"watch-css": "nodemon --ignore dist/ -e scss -x \"npm run css\"",
"watch-js": "nodemon --watch src/js/src/ -x \"npm run js\"",
"watch-pug": "nodemon -e pug -x \"npm run pug\""
},
"dependencies": {
"#coreui/coreui": "^2.1.12",
"#coreui/coreui-plugin-chartjs-custom-tooltips": "^1.3.1",
"#coreui/icons": "0.3.0",
"bootstrap": "^4.3.1",
"chart.js": "^2.8.0",
"core-js": "^3.1.4",
"flag-icon-css": "^3.3.0",
"font-awesome": "~4.7.0",
"jquery": "^3.4.1",
"pace-progress": "1.0.2",
"perfect-scrollbar": "^1.4.0",
"popper.js": "^1.15.0",
"regenerator-runtime": "^0.13.2",
"simple-line-icons": "2.4.1"
},
"devDependencies": {
"#babel/cli": "^7.5.0",
"#babel/core": "^7.5.4",
"#babel/plugin-proposal-object-rest-spread": "^7.5.4",
"#babel/plugin-proposal-throw-expressions": "^7.2.0",
"#babel/preset-env": "^7.5.4",
"autoprefixer": "^9.6.1",
"babel-eslint": "^10.0.2",
"babel-plugin-transform-es2015-modules-strip": "^0.1.1",
"browser-sync": "^2.26.7",
"chalk": "^2.4.2",
"clean-css-cli": "^4.3.0",
"copyfiles": "^2.1.1",
"cross-env": "^5.2.0",
"eslint": "^5.16.0",
"eslint-plugin-compat": "^3.2.0",
"foreach-cli": "^1.8.1",
"js-beautify": "^1.10.0",
"node-sass": "^4.12.0",
"nodemon": "^1.19.1",
"npm-run-all": "^4.1.5",
"postcss-cli": "^6.1.3",
"pug": "^2.0.4",
"rimraf": "^2.6.3",
"shelljs": "^0.8.3",
"stylelint": "^10.1.0",
"stylelint-config-recommended-scss": "^3.3.0",
"stylelint-config-standard": "^18.3.0",
"stylelint-order": "^3.0.1",
"stylelint-scss": "^3.9.1"
},
"engines": {
"node": ">=8"
},
"browserslist": [
"last 1 major version",
">= 1%",
"Chrome >= 45",
"Firefox >= 38",
"Edge >= 12",
"Explorer >= 10",
"iOS >= 9",
"Safari >= 9",
"Android >= 4.4",
"Opera >= 30"
]
}

Related

How to use puppeteer inside dependencies?

I am creating a dependancy to generate PDF on nestjs, to do it I am using puppeteer.
When I try to use puppeteer inside the dependancy I get an error:
Error: Run `npm install` to download the correct Chromium revision (1056772).
But when I do it from the project and not the dependancy there is no error. It only happen when I use puppeteer from the dependancy, but it's launched from the same project.
First I generated the PDF inside a nestjs project and it worked fine.
Then I moved the code to my library inside a service but then there is the error.
I tried to run the following command to install chromium
node node_modules/puppeteer/install.js
But nothing change and here is the result of the command:
Chromium is already in C:\Users\Greg.cache\puppeteer\chrome\win64-1069273; skipping download.
I also tried to delete the node modules and reinstall it but no change.
The package.json of the dependancy:
{
"name": "#gboutte/nestjs-pdf",
"version": "0.0.3",
"description": "This package provide a service to render PDF from html string or from handlebars tempaltes for nestjs.",
"keywords": [
"nestjs",
"handlebars",
"hbs",
"templates",
"pdf"
],
"homepage": "https://github.com/gboutte/nestjs-pdf#readme",
"bugs": {
"url": "https://github.com/gboutte/nestjs-pdf/issues",
"email": "gboutte#protonmail.com"
},
"repository": {
"type": "git",
"url": "https://github.com/gboutte/nestjs-pdf"
},
"main": "dist/index.js",
"types": "dist/index.d.ts",
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1",
"build": "rimraf dist && tsc",
"prepublish": "npm run build"
},
"author": "Grégory Boutte <gboutte#protonmail.com>",
"license": "MIT",
"dependencies": {},
"devDependencies": {
"#nestjs/common": "^9.1.6",
"#gboutte/nestjs-hbs": "^0.0.3",
"#types/node": "^18.11.5",
"puppeteer": "^19.1.2",
"reflect-metadata": "^0.1.13",
"rimraf": "^3.0.2",
"rxjs": "^7.5.7",
"typescript": "^4.8.4"
},
"peerDependencies": {
"#nestjs/common": "^9.1.6",
"#gboutte/nestjs-hbs": "^0.0.3",
"#types/node": "^18.11.5",
"puppeteer": "^19.1.2",
"reflect-metadata": "^0.1.13",
"rimraf": "^3.0.2",
"rxjs": "^7.5.7",
"typescript": "^4.8.4"
}
}
And the package.json of the main project
{
"name": "nestjs-hbs-demo",
"version": "0.0.1",
"description": "",
"author": "",
"private": true,
"main": "dist/index.js",
"readmeFilename": "README.md",
"files": [
"dist/**/*",
"*.md"
],
"license": "UNLICENSED",
"scripts": {
"prebuild": "rimraf dist",
"build": "nest build",
"format": "prettier --write \"src/**/*.ts\" \"test/**/*.ts\"",
"start": "nest start",
"start:dev": "nest start --watch",
"start:debug": "nest start --debug --watch",
"start:prod": "node dist/main",
"lint": "eslint \"{src,apps,libs,test}/**/*.ts\" --fix",
"test": "jest",
"test:watch": "jest --watch",
"test:cov": "jest --coverage",
"test:debug": "node --inspect-brk -r tsconfig-paths/register -r ts-node/register node_modules/.bin/jest --runInBand",
"test:e2e": "jest --config ./test/jest-e2e.json"
},
"dependencies": {
"#gboutte/nestjs-hbs": "file:../nestjs-hbs",
"#gboutte/nestjs-pdf": "file:../nestjs-pdf",
"#nestjs/common": "^9.0.0",
"#nestjs/core": "^9.0.0",
"#nestjs/platform-express": "^9.0.0",
"#nestjs/platform-fastify": "^9.1.6",
"puppeteer": "^19.4.1",
"reflect-metadata": "^0.1.13",
"rimraf": "^3.0.2",
"rxjs": "^7.2.0"
},
"devDependencies": {
"#nestjs/cli": "^9.0.0",
"#nestjs/schematics": "^9.0.0",
"#nestjs/testing": "^9.0.0",
"#types/express": "^4.17.13",
"#types/jest": "28.1.8",
"#types/node": "^16.0.0",
"#types/supertest": "^2.0.11",
"#typescript-eslint/eslint-plugin": "^5.0.0",
"#typescript-eslint/parser": "^5.0.0",
"eslint": "^8.0.1",
"eslint-config-prettier": "^8.3.0",
"eslint-plugin-prettier": "^4.0.0",
"jest": "28.1.3",
"prettier": "^2.3.2",
"source-map-support": "^0.5.20",
"supertest": "^6.1.3",
"ts-jest": "28.0.8",
"ts-loader": "^9.2.3",
"ts-node": "^10.0.0",
"tsconfig-paths": "4.1.0",
"typescript": "^4.7.4"
},
"jest": {
"moduleFileExtensions": [
"js",
"json",
"ts"
],
"rootDir": "src",
"testRegex": ".*\\.spec\\.ts$",
"transform": {
"^.+\\.(t|j)s$": "ts-jest"
},
"collectCoverageFrom": [
"**/*.(t|j)s"
],
"coverageDirectory": "../coverage",
"testEnvironment": "node"
}
}
I resolved the issue by updating my local nodejs and I changed the #types/node dependency of both project to be the same.
"#types/node": "^18.0.0",
I found out that it was this problem by trying to install the library with github instead of locally.
Before I used npm install ../directory-to-my-lib, then I used npm install <url to the github repo>.
The difference is that using github npm gave me an error saying that both version of #types/node were different, I don't know why I did not have this error using the other command.
Now that I fixed the version it works with all installation methods (npm package / github / locally).

Failed to load config "airbnb" to extend from. remote: Referenced from: /tmp/build_b7392388/client/.eslintrc.json

I get this error when I try to deploy to Heroku :
[eslint] Failed to load config "airbnb" to extend from.
remote: Referenced from: /tmp/build_b7392388/client/.eslintrc.json
I have a client-server architecture that looks like this:
And in detail it looks like this:
Client part contains .eslintrc.json but the server part (root folder) does not.
Here is package.json from server (root folder):
{
"proxy": "http://localhost:3001",
"name": "emoteco_nodejs",
"version": "1.0.0",
"description": "",
"main": "index.js",
"homepage": ".",
"scripts": {
"start": "node server/index.js",
"build": "cd client && npm install && npm run build",
"test": "echo \"Error: no test specified\" && exit 1"
},
"engines": {
"node": "14.17.5"
},
"keywords": [],
"author": "",
"license": "ISC",
"dependencies": {
"applicationinsights": "^2.3.0",
"axios": "^0.27.2",
"azure-storage": "^2.10.7",
"express": "^4.17.2",
"gm": "^1.23.1",
"image-data-uri": "^2.0.1",
"jsonwebtoken": "^8.5.1",
"mongodb": "^4.2.2",
"multer": "^1.4.5-lts.1",
"node-cron": "^3.0.0",
"node-html-to-image": "^3.2.4",
"nodemailer": "^6.7.7",
"react-validation": "^3.0.7",
"validator": "^13.7.0"
},
"devDependencies": {
"sass": "^1.52.1"
}
}
Here is package.json from client (sub folder):
{
"name": "emotecoapp",
"version": "2.0.1",
"private": true,
"author": "Creative Tim",
"license": "See license in https://www.creative-tim.com/license",
"description": "Otis Kit PRO by Creative Tim",
"homepage": "",
"bugs": {
"url": "https://github.com/creativetimofficial/ct-otis-kit-pro/issues"
},
"repository": {
"type": "git",
"url": "git+https://github.com/creativetimofficial/ct-otis-kit-pro.git"
},
"engines": {
"node": "14 || 15 || 16",
"npm": ">=6"
},
"dependencies": {
"#emotion/cache": "11.7.1",
"#emotion/react": "11.9.0",
"#emotion/styled": "11.8.1",
"#mui/icons-material": "5.6.2",
"#mui/material": "5.6.4",
"#mui/styled-engine": "5.6.1",
"#testing-library/jest-dom": "5.16.4",
"#testing-library/react": "13.2.0",
"#testing-library/user-event": "14.1.1",
"#types/jest": "^29.2.0",
"#types/node": "^18.11.7",
"#types/react": "^18.0.24",
"#types/react-dom": "^18.0.8",
"axios": "^1.1.3",
"chroma-js": "2.4.2",
"flatpickr": "4.6.13",
"onnxjs": "^0.1.8",
"prop-types": "15.8.1",
"react": "18.1.0",
"react-copy-to-clipboard": "5.1.0",
"react-countup": "6.2.0",
"react-dom": "18.1.0",
"react-flatpickr": "3.10.11",
"react-native-pytorch-core": "^0.2.2",
"react-router-dom": "6.3.0",
"react-scripts": "5.0.1",
"react-syntax-highlighter": "15.5.0",
"react-webcam": "^7.0.1",
"rellax": "1.12.1",
"swiper": "7.3.4",
"typed.js": "2.0.12",
"typescript": "^4.8.4",
"uuid": "8.3.2",
"web-vitals": "2.1.4"
},
"scripts": {
"start": "react-scripts start",
"build": "react-scripts build",
"test": "react-scripts test",
"eject": "react-scripts eject",
"install:clean": "rm -rf node_modules/ && rm -rf package-lock.json && npm install && npm start"
},
"browserslist": {
"production": [
">0.2%",
"not dead",
"not op_mini all"
],
"development": [
"last 1 chrome version",
"last 1 firefox version",
"last 1 safari version"
]
},
"devDependencies": {
"eslint": "^8.2.0",
"eslint-config-airbnb": "19.0.4",
"eslint-config-airbnb-base": "^15.0.0",
"eslint-config-prettier": "8.5.0",
"eslint-plugin-import": "^2.25.2",
"eslint-plugin-jsx-a11y": "6.5.1",
"eslint-plugin-prettier": "4.0.0",
"eslint-plugin-react": "7.29.4",
"eslint-plugin-react-hooks": "4.5.0",
"prettier": "2.6.2"
}
}
I have tried several solutions like:
1.
npm install -g install-peerdeps
install-peerdeps --dev eslint-config-airbnb
install-peerdeps --dev eslint-config-airbnb-base
It didn't work.
2.
I also tried to change the setting.json of the VScode workspace like this:
{
"eslint.workingDirectories": [
"./client"
]
}
It didn't work as well
I have tried most of suggested solutions on internet but nothing works on my case.
Do you have any idea how I can solve my issue?

Uncaught Error: Invalid hook call in React project using Material UI

I'm getting the following error in my react project:
Uncaught Error: Invalid hook call. Hooks can only be called inside of the body of a function component. This could happen for one of the following reasons:
1. You might have mismatching versions of React and the renderer (such as React DOM)
2. You might be breaking the Rules of Hooks
3. You might have more than one copy of React in the same app
See https://reactjs.org/link/invalid-hook-call for tips about how to debug and fix this problem.
React 2
useTheme useTheme.js:4
useTheme useThemeWithoutDefault.js:9
useTheme useTheme.js:7
Box createBox.js:22
React 17
js index.js:8
factory react refresh:6
Webpack 3
react.development.js:1447
React 2
useTheme useTheme.js:4
useTheme useThemeWithoutDefault.js:9
useTheme useTheme.js:7
Box createBox.js:22
React 17
js index.js:8
factory react refresh:6
Webpack 3
__webpack_require__
<anonymous>
<anonymous>
The project consists of 2 separate parts, Components and Onboarding. Onboarding uses Components as a dependency.
Inside Components, I have 2 package.json files, one in the root and one in src.
Root package.json:
{
"name": "My Project",
"version": "2.0.0",
"description": "Main React Library",
"main": "dist/index.js",
"module": "dist/index.js",
"bundleDependencies": false,
"deprecated": false,
"license": "MIT",
"private": true,
"sideEffects": false,
"scripts": {
"build": "rm -rf dist && NODE_ENV=production babel src --out-dir dist --copy-files"
},
"devDependencies": {
"#babel/cli": "^7.18.10",
"#babel/core": "^7.18.10",
"#babel/plugin-syntax-flow": "^7.18.6",
"#babel/polyfill": "^7.12.1",
"#babel/preset-env": "^7.18.10",
"#babel/preset-flow": "^7.18.6",
"#babel/preset-react": "^7.18.6",
"#types/node": "^18.7.15",
"typescript": "^4.8.2",
"reactstrap": "^9.1.4",
"react-quill": "^2.0.0"
},
"dependencies": {}
}
package.json inside src:
{
"name": "My Project",
"version": "2.0.0",
"description": "Main React Library",
"main": "index.js",
"module": "index.js",
"bundleDependencies": false,
"deprecated": false,
"license": "MIT",
"private": true,
"sideEffects": false,
"dependencies": {
"#mui/icons-material": "5.4.1",
"#mui/material": "5.4.1",
"#mui/styled-engine": "5.4.1",
"react": "17.0.2",
"react-dom": "17.0.2",
"react-router-dom": "6.2.1",
"axios": "^0.27.2",
"uuid": "^9.0.0",
"bootstrap": "^5.2.0"
}
}
Inside Onboarding, I also have 2 package.json files, one in the root and one in src:
Root package.json:
{
"name": "onboarding-ui",
"description": "",
"version": "0.1.0",
"scripts": {
"start": "sls offline --aws-profile",
"deploy": "sls deploy -s stage --aws-profile",
"test": "sls invoke test"
},
"devDependencies": {
"aws-sdk-mock": "^5.7.0",
"serverless": "^3.21.0",
"serverless-cloudfront-invalidate": "^1.11.0",
"serverless-latest-layer-version": "^2.1.1",
"serverless-mocha-plugin": "^1.12.0",
"serverless-offline": "^6.8.0",
"serverless-prune-plugin": "^1.4.3",
"serverless-s3-sync": "^1.14.4",
"serverless-scriptable-plugin": "^1.0.5"
}
}
package.json inside src:
{
"name": "onboarding",
"version": "0.2.17",
"private": true,
"author": "Me",
"license": "MIT",
"description": "presentation layer.",
"engines": {
"node": "14 || 15 || 16",
"npm": ">=6"
},
"dependencies": {
"#asseinfo/react-kanban": "2.2.0",
"#emotion/cache": "11.7.1",
"#emotion/react": "11.7.1",
"#emotion/styled": "11.6.0",
"#mui/icons-material": "5.4.1",
"#mui/material": "5.4.1",
"#mui/styled-engine": "5.4.1",
"#mui/styles": "^5.9.2",
"#react-jvectormap/core": "1.0.1",
"#react-jvectormap/world": "1.0.0",
"#testing-library/jest-dom": "5.16.2",
"#testing-library/react": "12.1.2",
"#testing-library/user-event": "13.5.0",
"accounted-ui": "../../Components/dist",
"axios": "^0.27.2",
"chart.js": "3.4.1",
"chroma-js": "2.4.2",
"crypto-js": "^4.1.1",
"dropzone": "5.9.2",
"flatpickr": "4.6.9",
"formik": "^2.2.9",
"html-react-parser": "1.4.8",
"i18next": "^21.9.1",
"i18next-browser-languagedetector": "^6.1.5",
"i18next-http-backend": "^1.4.1",
"lodash.debounce": "^4.0.8",
"prop-types": "15.8.1",
"react": "17.0.2",
"react-chartjs-2": "3.0.4",
"react-confetti": "^6.1.0",
"react-csv": "^2.2.2",
"react-debounce-input": "^3.3.0",
"react-dom": "17.0.2",
"react-flatpickr": "3.10.7",
"react-github-btn": "1.2.1",
"react-i18next": "^11.18.5",
"react-images-viewer": "1.7.1",
"react-quill": "1.3.5",
"react-router-dom": "6.2.1",
"react-scripts": "5.0.0",
"react-table": "7.7.0",
"react-toastify": "^9.0.3",
"stylis": "4.0.13",
"uuid": "8.3.2",
"web-vitals": "2.1.4",
"yup": "^0.32.11"
},
"scripts": {
"start": "react-scripts start",
"build:dev": "dotenv -e .env.dev react-scripts build",
"build:prod": "dotenv -e .env.prod react-scripts build",
"test": "react-scripts test",
"eject": "react-scripts eject",
"install:clean": "rm -rf node_modules/ && rm -rf package-lock.json && npm install"
},
"eslintConfig": {
"extends": [
"react-app",
"react-app/jest"
]
},
"browserslist": {
"production": [
">0.2%",
"not dead",
"not op_mini all"
],
"development": [
"last 1 chrome version",
"last 1 firefox version",
"last 1 safari version"
]
},
"devDependencies": {
"accounted-ui": "../../Components/dist", // this is how I'm pulling in the `Components` folder
"dotenv-cli": "^5.1.0",
"eslint": "8.8.0",
"eslint-config-airbnb": "19.0.4",
"eslint-config-prettier": "8.3.0",
"eslint-plugin-import": "2.25.4",
"eslint-plugin-jsx-a11y": "6.5.1",
"eslint-plugin-prettier": "4.0.0",
"eslint-plugin-react": "7.28.0",
"eslint-plugin-react-hooks": "4.3.0",
"prettier": "2.5.1"
}
}
The project is using Material UI, which I suspect might also have something to do with this. I tried many suggestions but nothing has worked so far. Would appreciate it if anyone can help with this.

How to create tree-shakable react module? package.json "exports" not working

I'm trying to build a react components library (e.g Buttons, Modals, etc.)
But until now I still cannot figure how to do nested imports
the objective that i want to have is to be able to do this
import Something from '#company/moduleName/Something'
here is my package.json
{
"name": "#company/moduleName",
"version": "1.0.0",
"description": "company's react design system",
"author": "",
"license": "",
"repository": "",
"main": "dist/index.js",
"module": "dist/index.modern.js",
"source": "src/index.js",
"engines": {
"node": ">=13",
"npm": ">=7"
},
"type": "module",
"exports": {
".": "./dist/index.modern.js",
"./Button": "./dist/Button.modern.js",
"./Container": "./dist/Container.modern.js",
"./Input": "./dist/Input.modern.js",
"./Modal": "./dist/Modal.modern.js",
"./Select": "./dist/Select.modern.js",
"./Separator": "./dist/Separator.modern.js",
"./Sidebar": "./dist/Sidebar.modern.js",
"./Tab": "./dist/Tab.modern.js",
"./TextArea": "./dist/TextArea.modern.js",
"./theme": "./dist/theme.modern.js",
"./Typography": "./dist/Typography.modern.js"
},
"scripts": {
"build": "microbundle src/*.js --no-compress --no-sourcemap -f modern,cjs",
"start": "microbundle src/*.js --no-compress --no-sourcemap -f modern,cjs watch",
"rename": "cd dist && ren *.modern.js *.js",
"prepare": "run-s build",
"test": "run-s test:unit test:lint test:build",
"test:build": "run-s build",
"test:lint": "eslint .",
"test:unit": "cross-env CI=1 react-scripts test --env=jsdom",
"test:watch": "react-scripts test --env=jsdom",
"predeploy": "cd example && npm install && npm run build",
"deploy": "gh-pages -d example/build"
},
"peerDependencies": {
"react": "^17.0.1",
"lodash.merge": "^4.6.2",
"react-icons": "^4.2.0",
"react-modal": "^3.12.1",
"react-select": "^4.1.0",
"styled-components": "^5.2.1"
},
"devDependencies": {
"babel-eslint": "^10.0.3",
"cross-env": "^7.0.2",
"env-cmd": "^10.1.0",
"eslint": "^7.21.0",
"eslint-config-prettier": "^6.7.0",
"eslint-config-standard": "^14.1.0",
"eslint-config-standard-react": "^9.2.0",
"eslint-plugin-import": "^2.18.2",
"eslint-plugin-node": "^11.0.0",
"eslint-plugin-prettier": "^3.1.1",
"eslint-plugin-promise": "^4.2.1",
"eslint-plugin-react": "^7.17.0",
"eslint-plugin-standard": "^4.0.1",
"gh-pages": "^2.2.0",
"microbundle": "latest",
"npm-run-all": "^4.1.5",
"prettier": "^2.0.4",
"react": "^17.0.1",
"react-dom": "^17.0.1",
"react-scripts": "^4.0.3",
"lodash.merge": "^4.6.2",
"react-icons": "^4.2.0",
"react-modal": "^3.12.1",
"react-select": "^4.1.0",
"styled-components": "^5.2.1"
},
"files": [
"dist"
],
}
currently i'm using microbundle to build everything in the src/ folder. I've added the exports field but it still says this in the example project inside the module
Module not found: Can't resolve '#company/moduleName/Button' in 'E:\Projects\Software\company\moduleName\example\src'
edit
To be clear, the dist folder shows up the correct desired result
-dist
index.modern.js
Modal.modern.js
...
I've also been able to do this, but this is not the desired output
#company/moduleName/dist/Something.modern
Any help would be greatly appreciated!

Babel and Deploy Nodejs to Google App Engine

I'm a newbie nodejs. I have a trouble about deploying nodejs app to google app engine. This is my error, I have been trying to fix it but it's not work. I've installed babel.
Bug
Updating service [default]...failed.
ERROR: (gcloud.app.deploy) Error Response: [9]
Application startup error:
restaurant_api#1.0.0 prestart /app
npm run -s build
You have mistakenly installed the babel package, which is a no-op in Babel 6.
Babel's CLI commands have been moved from the babel package to the babel-cli package.
npm uninstall babel
npm install --save-dev babel-cli
This is my package.json
"main": "dist",
"scripts": {
"dev": "NODE_ENV=development nodemon -w src --exec \"babel-node src --presets es2015,stage-0\"",
"build": "babel src -s -D -d dist --presets es2015,stage-0",
"start": "NODE_ENV=production pm2 start dist",
"prestart": "npm run -s build",
"lint": "eslint src",
"test": "echo \"Error: no test specified\" && exit 1",
"babel-version": "babel --version"
},
"eslintConfig": {
"parserOptions": {
"ecmaVersion": 7,
"sourceType": "module"
},
"env": {
"node": true
},
"rules": {
"no-console": 0,
"no-unused-vars": 1
}
},
"author": "",
"license": "ISC",
"dependencies": {
"babel": "^6.23.0",
"body-parser": "^1.17.0",
"express": "^4.15.0",
"express-jwt": "^5.1.0",
"jsonwebtoken": "^7.3.0",
"mongoose": "^4.8.5",
"passport": "^0.3.2",
"passport-local": "^1.0.0",
"passport-local-mongoose": "^4.0.0",
"pm2": "^2.4.2"
},
"devDependencies": {
"babel-cli": "^6.23.0",
"babel-eslint": "^7.1.1",
"babel-preset-es2015": "^6.22.0",
"babel-preset-stage-0": "^6.22.0",
"eslint": "^3.16.1"
}
Problem is quite simple, if you notice clearly GAE, does not install dev-dependencies. So move your dev-deps above inside deps , like I did and babel no found error is gone.
{
"name": "scraping",
"version": "0.3.0",
"description": "Starter project for an ES6 RESTful Express API",
"main": "dist",
"scripts": {
"dev": "nodemon -w src --exec \"babel-node src --presets es2015,stage-0\"",
"build": "babel src -s -D -d dist --presets es2015,stage-0",
"start": "node dist",
"prestart": "npm run -s build",
"test": "eslint src"
},
"eslintConfig": {
"extends": "eslint:recommended",
"parserOptions": {
"ecmaVersion": 7,
"sourceType": "module"
},
"env": {
"node": true
},
"rules": {
"no-console": 0,
"no-unused-vars": 1
}
},
"repository": {
"type": "git",
"url": "git+https://github.com/developit/express-es6-rest-api.git"
},
"author": "Saransh Sharma <jason#developit.ca>",
"license": "MIT",
"dependencies": {
"body-parser": "^1.13.3",
"compression": "^1.5.2",
"cors": "^2.7.1",
"express": "^4.13.3",
"morgan": "^1.8.0",
"resource-router-middleware": "^0.6.0",
"#jonstuebe/scraper": "^0.1.4",
"babel-cli": "^6.9.0",
"babel-core": "^6.9.0",
"babel-preset-es2015": "^6.9.0",
"babel-preset-stage-0": "^6.5.0",
"eslint": "^3.1.1",
"nodemon": "^1.9.2"
},
"devDependencies": {
"babel-cli": "^6.9.0",
"babel-core": "^6.9.0",
"babel-preset-es2015": "^6.9.0",
"babel-preset-stage-0": "^6.5.0",
"eslint": "^3.1.1",
"nodemon": "^1.9.2"
},
"bugs": {
"url": "https://github.com/developit/express-es6-rest-api/issues"
},
"homepage": "https://github.com/developit/express-es6-rest-api#readme",
"keywords": [
"scraper",
"product",
"from",
"amazon"
]
}
The clue is in the error message.
In your devDependencies section, you already have babel-cli included.
However, your dependencies section still has a reference to "babel": "^6.23.0".
Either remove this line, or replace it with babel-cli, leaving you with:
"dependencies": {
"babel-cli": "^6.23.0",
"body-parser": "^1.17.0",
"express": "^4.15.0",
"express-jwt": "^5.1.0",
"jsonwebtoken": "^7.3.0",
"mongoose": "^4.8.5",
"passport": "^0.3.2",
"passport-local": "^1.0.0",
"passport-local-mongoose": "^4.0.0",
"pm2": "^2.4.2"
},
You need to install babel-cli globally, i.e. run the command "npm install babel-cli -g" as part of your build npm script, or create a pre-install script that install it if you want to keep it more organized in case you need to add more things later on.
"scripts": {
"dev": "NODE_ENV=development nodemon -w src --exec \"babel-node src --presets es2015,stage-0\"",
"build": "npm install bable-cli -g && babel src -s -D -d dist --presets es2015,stage-0",

Resources