I'm using electron and webpack.
When building dev-mode my project.
Node Error appear "UnhandledPromiseRejectionWarning: Unhandled promise rejection (rejection id: 1): Error: Exited with code 2" "DeprecationWarning: Unhandled promise rejections are deprecated. In the future, promise rejections that are not handled will terminate the Node.js process with a non-zero exit code.".
And Dose not open electron.
I'm checked firewall.
How I setting currently my project?
This is my package.json.
enter image description here
{
"name": "abce",
"productName": "abce Launcher",
"version": "0.10.0",
"main": "main.js",
"scripts": {
"test": "cross-env NODE_ENV=test node --trace-warnings ./test/runTests.js",
"test-all": "npm run test && npm run build && npm run test-e2e",
"test-watch": "npm test -- --watch",
"test-e2e": "cross-env NODE_ENV=test node --trace-warnings ./test/runTests.js e2e",
"hot-server": "cross-env NODE_ENV=development node --max_old_space_size=4096 server.js",
"build-main": "cross-env NODE_ENV=production node --max_old_space_size=4096 ./node_modules/webpack/bin/webpack --config webpack.config.electron.js --progress --profile --colors",
"build-renderer": "cross-env NODE_ENV=production node --max_old_space_size=4096 ./node_modules/webpack/bin/webpack --config webpack.config.production.js --progress --profile --colors",
"build-web": "cross-env NODE_ENV=production node --max_old_space_size=4096 --trace-warnings -r babel-register ./node_modules/webpack/bin/webpack --config webpack.config.web.production.js --progress --profile --colors",
"build": "npm run deploy-content-api && npm run build-main && npm run build-renderer",
"start": "cross-env NODE_ENV=production electron ./app/",
"start-hot": "cross-env HOT=1 NODE_ENV=development electron -r babel-register -r babel-polyfill ./app/main.development",
"postinstall": "npm run build",
"dev": "npm run deploy-content-api && npm run hot-server -- --start-hot",
"dev-web": "cross-env NODE_ENV=development node --trace-warnings -r babel-register ./node_modules/webpack/bin/webpack --config webpack.config.web.development.js --progress --profile --colors",
"dev-web-hot": "cross-env START_HOT=1 NODE_ENV=development node --trace-warnings ./node_modules/webpack-dev-server/bin/webpack-dev-server --config webpack.config.web.development.js",
"package": "npm run build && build --publish never",
"package-win": "npm run build && build --win --x64",
"package-linux": "npm run build && build --linux",
"package-all": "npm run build && build -mwl",
"cleanup": "mop -v",
"deploy-content-api": "cross-env uglifyjs ./content-api/tree-launcher-content.js -c -m -o ./app/public/tree-launcher-content.js",
"prettier": "prettier --write \"**/*.*(js|jsx|ts|tsx)\""
},
"jest": {
"moduleNameMapper": {
"\\.(jpg|jpeg|png|gif|eot|otf|webp|svg|ttf|woff|woff2|mp4|webm|wav|mp3|m4a|aac|oga)$": "<rootDir>/internals/mocks/fileMock.js",
"\\.(css|less|sass|scss)$": "identity-obj-proxy"
},
"moduleFileExtensions": [
"ts",
"tsx",
"js"
],
"moduleDirectories": [
"node_modules",
"app/node_modules"
],
"transform": {
"^.+\\.(ts|tsx)$": "<rootDir>/test/preprocessor.js"
},
"testMatch": [
"**/?(*.)(spec|test).ts?(x)"
]
},
"build": {
"productName": "Elif Launcher",
"appId": "com.visang.fel-launcher",
"asar": false,
"dmg": {
"contents": [
{
"x": 410,
"y": 150,
"type": "link",
"path": "/Applications"
},
{
"x": 130,
"y": 150,
"type": "file"
}
]
},
"files": [
"dist/",
"!dist/**/*.*.map",
"node_modules/",
"app.html",
"main.js",
"fel.sql",
"fel.yaml",
"fel_server.exe",
"OSKSpawner.exe",
"static/",
"public/",
"package.json",
"settings.json"
],
"directories": {
"buildResources": "resources",
"output": "release"
},
"win": {
"target": "dir"
},
"linux": {
"target": [
"deb",
"AppImage"
]
}
},
"bin": {
"electron": "./node_modules/.bin/electron"
},
"devDependencies": {
"#types/enzyme": "^2.5.39",
"#types/history": "^4.5.2",
"#types/jest": "^20.0.2",
"#types/node": "~8.0.2",
"#types/react": "^15.0.37",
"#types/react-dom": "^15.5.1",
"#types/react-hot-loader": "^3.0.1",
"#types/react-redux": "^5.0.4",
"#types/react-router": "^4.0.11",
"#types/react-router-dom": "^4.0.7",
"#types/react-router-redux": "^5.0.2",
"#types/redux-logger": "^3.0.0",
"#types/sinon": "^2.3.1",
"asar": "^0.13.0",
"babel-eslint": "^7.2.3",
"babel-plugin-dev-expression": "^0.2.1",
"babel-plugin-dynamic-import-webpack": "^1.0.1",
"babel-polyfill": "^6.26.0",
"babel-preset-env": "^1.6.0",
"babel-register": "^6.26.0",
"boiler-room-custodian": "^0.6.2",
"concurrently": "^3.1.0",
"copy-webpack-plugin": "^4.0.1",
"cross-env": "^5.0.1",
"css-loader": "^0.28.4",
"css-modules-require-hook": "^4.0.6",
"devtron": "^1.4.0",
"electron": "1.6.7",
"electron-builder": "^19.8.0",
"electron-builder-http": "^19.15.0",
"electron-devtools-installer": "^2.0.1",
"electron-rebuild": "^1.6.0",
"enzyme": "^2.7.0",
"eslint": "^4.6.1",
"eslint-config-airbnb": "^15.1.0",
"eslint-formatter-pretty": "^1.3.0",
"eslint-import-resolver-webpack": "^0.8.3",
"eslint-plugin-compat": "^1.0.4",
"eslint-plugin-import": "^2.7.0",
"eslint-plugin-jsx-a11y": "^6.0.2",
"eslint-plugin-promise": "^3.5.0",
"eslint-plugin-react": "^7.3.0",
"express": "^4.14.0",
"extract-text-webpack-plugin": "^3.0.0",
"file-loader": "1.1.5",
"html-webpack-plugin": "^2.24.1",
"identity-obj-proxy": "^3.0.0",
"jest": "^20.0.4",
"json-loader": "^0.5.4",
"node-sass": "^4.1.1",
"prettier": "^1.18.2",
"react-addons-test-utils": "^15.4.1",
"react-hot-loader": "^3.0.0-beta.6",
"redux-logger": "^3.0.6",
"sass-loader": "^6.0.6",
"sinon": "^3.2.1",
"spectron": "^3.4.1",
"style-loader": "^0.18.2",
"ts-loader": "^2.2.0",
"ts-node": "^3.1.0",
"tslint": "5.15.0",
"tslint-config-prettier": "^1.18.0",
"tslint-loader": "^3.5.3",
"tslint-react": "^3.2.0",
"typescript": "3.4.3",
"uglify-js": "^3.4.4",
"url-loader": "^0.5.7",
"webpack": "^3.3.0",
"webpack-dev-middleware": "^1.9.0",
"webpack-hot-middleware": "^2.13.2",
"webpack-merge": "^2.0.0"
},
"dependencies": {
"#types/classnames": "^2.2.9",
"babili-webpack-plugin": "^0.1.2",
"classnames": "^2.2.6",
"electron-debug": "^1.2.0",
"font-awesome": "^4.7.0",
"google-protobuf": "^3.3.0",
"grpc": "^1.3.2",
"history": "^4.6.3",
"md5-file": "^4.0.0",
"moment": "^2.19.1",
"react": "^16.8.6",
"react-dom": "^16.8.6",
"react-draggable": "^3.0.5",
"react-id-swiper": "1.5.7",
"react-progressbar.js": "^0.2.0",
"react-redux": "^5.0.5",
"react-router": "^4.1.1",
"react-router-dom": "^4.1.1",
"react-router-redux": "^5.0.0-alpha.6",
"redux": "^3.7.1",
"redux-saga": "^0.15.3",
"rxjs": "^5.4.0",
"source-map-support": "~0.4.15",
"uuid": "^3.1.0",
"winston": "2.4.0",
"winston-daily-rotate-file": "^1.4.6"
},
"devEngines": {
"node": ">=6.x",
"npm": ">=3.x"
}
}
Related
I'm working on a nextJS project which uses mikro-orm , and I'm facing this error for days now:
C:\Users\BossTrails\Documents\core.nest-main_2\node_modules\.bin\mikro-orm:2
basedir=$(dirname "$(echo "$0" | sed -e 's,\\,/,g')")
^^^^^^^
SyntaxError: missing ) after argument list
at Object.compileFunction (node:vm:352:18)
at wrapSafe (node:internal/modules/cjs/loader:1033:15)
at Module._compile (node:internal/modules/cjs/loader:1069:27)
at Object.Module._extensions..js (node:internal/modules/cjs/loader:1159:10)
at Module.load (node:internal/modules/cjs/loader:981:32)
at Function.Module._load (node:internal/modules/cjs/loader:822:12)
at Function.executeUserEntryPoint [as runMain] (node:internal/modules/run_main:77:12)
at node:internal/main/run_main_module:17:47
I get the error above when I try to run the comman - npm run migration:fresh:seed
Here is my package.json
{
"name": "backend",
"version": "0.0.1",
"description": "",
"author": "",
"private": true,
"license": "UNLICENSED",
"scripts": {
"prebuild": "rimraf dist",
"build": "nest build",
"format": "prettier --write \"src/**/*.ts\" \"test/**/*.ts\"",
"start:server": "nest start --config nest-cli.server.json",
"migration:fresh": "node node_modules/.bin/mikro-orm migration:fresh",
"migration:fresh:seed": "node node_modules/.bin/mikro-orm migration:fresh --seed",
"migration:init": "node node_modules/.bin/mikro-orm migration:create --initial",
"migration:create": "node node_modules/.bin/mikro-orm migration:create",
"migration:up": "node node_modules/.bin/mikro-orm migration:up",
"migration:down": "node node_modules/.bin/mikro-orm migration:down",
"migration:down:zero": "node node_modules/.bin/mikro-orm migration:down --to 0",
"migration:rollout": "node node_modules/.bin/ts-node ./src/scripts/rollout-migrations",
"start:server:dev": "nest start --config nest-cli.server.json --watch",
"start:server:debug": "nest start --config nest-cli.server.json --debug --watch",
"start:server:dist": "node dist/server",
"start:worker": "nest start --config nest-cli.worker.json",
"start:worker:dev": "nest start --config nest-cli.worker.json --watch",
"start:worker:debug": "nest start --config nest-cli.worker.json --debug --watch",
"start:worker:dist": "node dist/worker",
"lint": "./node_modules/.bin/eslint \"{src,test}/**/*.ts\"",
"lint:fix": "./node_modules/.bin/eslint \"{src,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": {
"#faker-js/faker": "^6.1.1",
"#mikro-orm/cli": "^5.1.1",
"#mikro-orm/core": "^5.1.1",
"#mikro-orm/knex": "^5.0.0-dev.434",
"#mikro-orm/migrations": "^5.1.1",
"#mikro-orm/nestjs": "^5.0.1",
"#mikro-orm/postgresql": "^5.1.1",
"#mikro-orm/reflection": "^5.1.1",
"#mikro-orm/seeder": "^5.1.1",
"#nestjs/axios": "^0.0.3",
"#nestjs/common": "^8.0.0",
"#nestjs/config": "^1.0.2",
"#nestjs/core": "^8.0.0",
"#nestjs/event-emitter": "^1.1.1",
"#nestjs/graphql": "^9.1.2",
"#nestjs/jwt": "^8.0.0",
"#nestjs/passport": "^8.0.1",
"#nestjs/platform-express": "^8.0.0",
"#nestjs/platform-socket.io": "^8.4.4",
"#nestjs/platform-ws": "^8.4.4",
"#nestjs/schedule": "^1.0.2",
"#nestjs/swagger": "^5.1.4",
"#nestjs/websockets": "^8.4.4",
"#svtslv/nestjs-ioredis": "^1.0.2",
"#types/cookie": "^0.5.1",
"#types/socket.io": "^3.0.2",
"amqp-ts": "^1.8.0",
"apollo-server-core": "^3.6.7",
"apollo-server-express": "^3.5.0",
"aws-sdk": "^2.1034.0",
"axios": "^0.24.0",
"bcrypt": "^5.0.1",
"class-transformer": "^0.4.0",
"class-validator": "^0.13.1",
"cookie": "^0.5.0",
"file-type": "^16.5.3",
"firebase-admin": "^10.0.0",
"graphql": "^15.8.0",
"graphql-subscriptions": "^2.0.0",
"graphql-ws": "^5.5.5",
"ioredis": "^4.28.0",
"nestjs-redis": "^1.3.3",
"otp-generator": "^3.0.0",
"passport": "^0.4.1",
"passport-jwt": "^4.0.0",
"passport-local": "^1.0.0",
"reflect-metadata": "^0.1.13",
"rimraf": "^3.0.2",
"rxjs": "^7.2.0",
"swagger-ui-express": "^4.1.6",
"txtgen": "^2.2.8",
"typedi": "^0.10.0"
},
"devDependencies": {
"#nestjs/cli": "^8.0.0",
"#nestjs/schematics": "^8.0.0",
"#nestjs/testing": "^8.0.0",
"#types/bcrypt": "^5.0.0",
"#types/cron": "^1.7.3",
"#types/express": "^4.17.13",
"#types/faker": "^5.5.9",
"#types/imagemin": "^8.0.0",
"#types/imagemin-jpegtran": "^5.0.1",
"#types/ioredis": "^4.27.8",
"#types/jest": "^27.0.1",
"#types/lodash": "^4.14.176",
"#types/multer": "^1.4.7",
"#types/node": "^16.0.0",
"#types/passport-jwt": "^3.0.6",
"#types/passport-local": "^1.0.34",
"#types/supertest": "^2.0.11",
"#types/uuid": "^8.3.1",
"#typescript-eslint/eslint-plugin": "^5.16.0",
"#typescript-eslint/parser": "^5.16.0",
"eslint": "^8.11.0",
"eslint-config-prettier": "^8.5.0",
"eslint-plugin-jest": "^26.1.3",
"eslint-plugin-prettier": "^4.0.0",
"jest": "^27.0.6",
"prettier": "^2.6.0",
"prettier-eslint": "^13.0.0",
"supertest": "^6.1.3",
"ts-jest": "^27.0.3",
"ts-loader": "^9.2.3",
"ts-node": "^10.0.0",
"tsconfig-paths": "^3.10.1",
"typescript": "^4.6.2"
},
"jest": {
"moduleFileExtensions": [
"js",
"json",
"ts"
],
"rootDir": "src",
"testRegex": ".*\\.spec\\.ts$",
"transform": {
"^.+\\.(t|j)s$": "ts-jest"
},
"collectCoverageFrom": [
"**/*.(t|j)s"
],
"coverageDirectory": "../coverage",
"testEnvironment": "node"
},
"mikro-orm": {
"useTsNode": true,
"configPaths": [
"./src/mikro-orm.config.ts",
"./dist/mikro-orm.config.js"
]
},
"files": [
"src"
]
}
I've cleaned node packages
I've reinstalled npm and yarn
The same error I am getting with npm and yarn
I'm using:
windows 10
node version: 16.15.0
npm: 8.5.5
I fixed it!
The problem was a windows issue. Windows had issues reading a bash file or something. But the whole set up works well on Linux or Mac.
So you can either switch to mac or linux.
OR
Use WSL ( the windows Linux distro). Install node and npm on the WSL , connect VS code to the WSL so that you can run and edit the code on VS code.
Run you scripts with the linux bash terminal which will now be set up in vs code
I already add this to my package.json dist/custom-elements/index.mjs": "dist/custom-elements/index.js why i am having this error (below). did i miss something?
{
"name": "#map/react-app",
"private": true,
"scripts": {
"start": "webpack serve",
"start:standalone": "webpack serve --port 9003 --env standalone",
"build": "concurrently yarn:build:*",
"build:webpack": "webpack --mode=production",
"analyze": "webpack --mode=production --env analyze",
"lint": "eslint src --ext js",
"format": "prettier --write .",
"check-format": "prettier --check .",
"test": "cross-env BABEL_ENV=test jest",
"watch-tests": "cross-env BABEL_ENV=test jest --watch",
"prepare": "husky install",
"coverage": "cross-env BABEL_ENV=test jest --coverage"
},
"devDependencies": {
"#babel/core": "^7.15.0",
"#babel/eslint-parser": "^7.15.0",
"#babel/plugin-transform-runtime": "^7.15.0",
"#babel/preset-env": "^7.15.0",
"#babel/preset-react": "^7.14.5",
"#babel/runtime": "^7.15.3",
"#testing-library/jest-dom": "^5.14.1",
"#testing-library/react": "^12.0.0",
"babel-jest": "^27.0.6",
"concurrently": "^6.2.1",
"cross-env": "^7.0.3",
"eslint": "^7.32.0",
"eslint-config-prettier": "^8.3.0",
"eslint-config-react-important-stuff": "^3.0.0",
"eslint-plugin-prettier": "^3.4.1",
"husky": "^7.0.4",
"identity-obj-proxy": "^3.0.0",
"jest": "^27.0.6",
"jest-cli": "^27.0.6",
"prettier": "^2.3.2",
"pretty-quick": "^3.1.1",
"webpack": "^5.51.1",
"webpack-cli": "^4.8.0",
"webpack-config-single-spa-react": "^4.0.0",
"webpack-dev-server": "^4.0.0",
"webpack-merge": "^5.8.0"
},
"dependencies": {
"#arcgis/core": "^4.21.2",
"#material-ui/styles": "^4.11.4",
"#mui/styles": "^5.2.2",
"#reach/router": "^1.3.4",
"#stencil/core": "^2.11.0",
"browserify": "^17.0.0",
"dotenv": "^10.0.0",
"dotenv-webpack": "^7.0.3",
"path-browserify": "^1.0.1",
"react": "^17.0.2",
"react-dom": "^17.0.2",
"single-spa-react": "^4.3.1",
"web-vitals": "^2.1.2"
},
"lint-staged": {
"*.{js,jsx}": "pretty-quick --staged && eslint --fix"
},
"browser": {
"dist/custom-elements/index.mjs": "dist/custom-elements/index.js" // I'll already add this to may package.json, why i am having this error?
}
}
error
ERROR in
./node_modules/#esri/calcite-components/dist/custom-elements/index.mjs
1:0-147
Module not found: Error: Can't resolve '#stencil/core/internal/client'
in
'C:\Users\Ronald\Desktop\Map\app-react\node_modules#esri\calcite-components\dist\custom-elements'
Did you mean 'index.js'? BREAKING CHANGE: The request
'#stencil/core/internal/client' failed to resolve only because it was
resolved as fully specified (probably because the origin is strict
EcmaScript Module, e. g. a module with javascript mimetype, a '.mjs'
file, or a '.js' file where the package.json contains '"type":
"module"'). The extension in the request is mandatory for it to be
fully specified. Add the extension to the request.
The best solutions on this is in your webpack.config.js add this code
module:{
rules:[
{
test: /\.m?js/,
resolve: {
fullySpecified: false
}
}
]
},
and removed the browser in your package.json
I'm running into an issue where my build works fine on master branch, but on a sub-branch it is producing an error of "Uncaught ReferenceError: react is not defined". The package.json for both branches are a little different, but I'm still unsure why the sub-branch is showing that error as React is listed as a dependency for both.
master-branch:
{
"name": "master-branch",
"version": "0.0.1",
"description": "master-branch",
"main": "lib/index.js",
"pre-commit": [
"test"
],
"peerDependencies": {
"antd": "3.x",
"react": "16.x",
"react-dom": "16.x"
},
"scripts": {
"build": "rm -rf lib && NODE_ENV=production webpack --progress --config webpack.config.js ",
"docs:clean": "rm -rf docs/dist",
"docs:deploy": "yarn docs && gh-pages -d docs/dist",
"docs": "esdoc && yarn test:coverage && node docs/post-doc",
"test": "NODE_ENV=test jest",
"test:coverage": "jest --coverage",
"test:watch": "jest --watch",
"watch": "watch-run -p 'src/**' yarn build",
"storybook": "start-storybook -p 6006",
"storybook:watch": "concurrently \"yarn watch\" \"yarn storybook\"",
"storybook:build": "build-storybook -c .storybook -o build-stories"
},
"babel": {
"presets": [
"es2015",
"stage-0",
"react"
],
"plugins": [
"transform-class-properties",
"transform-custom-element-classes",
"transform-es2015-classes",
"transform-export-extensions"
]
},
"jest": {
"coverageDirectory": "docs/dist/coverage"
},
"dependencies": {
"antd": "3.6.5",
"async": "^2.6.0",
"axios": "^0.19.0",
"chance": "^1.0.13",
"classnames": "^2.2.5",
"jquery": "^3.2.1",
"lodash": "^4.17.15",
"md5": "^2.2.1",
"react-jss": "^8.4.0",
"store": "^2.0.12"
},
"devDependencies": {
"#storybook/addon-actions": "^5.2.5",
"#storybook/addon-links": "^5.2.5",
"#storybook/react": "^5.2.5",
"babel-cli": "^6.26.0",
"babel-core": "^6.26.3",
"babel-loader": "^7.1.4",
"babel-plugin-transform-class-properties": "^6.24.1",
"babel-plugin-transform-custom-element-classes": "^0.1.0",
"babel-plugin-transform-es2015-classes": "^6.24.1",
"babel-plugin-transform-export-extensions": "^6.22.0",
"babel-preset-es2015": "^6.24.1",
"babel-preset-react": "^6.24.1",
"babel-preset-stage-0": "^6.24.1",
"esdoc": "^1.0.3",
"esdoc-ecmascript-proposal-plugin": "^1.0.0",
"esdoc-react-plugin": "^1.0.1",
"esdoc-standard-plugin": "^1.0.0",
"gh-pages": "^1.0.0",
"jest": "^23.6.0",
"pre-commit": "^1.2.2",
"react": "^16.3.2",
"react-dom": "^16.3.2",
"react-test-renderer": "^16.0.0",
"url-loader": "^1.1.1",
"watch-run": "^1.2.5",
"webpack": "^3.8.1",
"webpack-cli": "^2.0.4"
},
"author": "",
"homepage": "",
"license": "MIT",
"repository": "",
"keywords": [
"react-component"
]
}
sub-branch:
{
"name": "sub-branch",
"version": "0.0.1",
"description": "sub-branch",
"main": "lib/index.js",
"pre-commit": [
"test"
],
"peerDependencies": {
"antd": "3.6.5",
"classnames": "^2.2.6",
"prop-types": "^15.7.2",
"react": "16.8",
"react-dom": "^16.9.0",
"react-jss": "^8.6.1"
},
"scripts": {
"build": "rm -rf lib && NODE_ENV=production webpack --mode production --progress --config webpack.config.js ",
"docs:clean": "rm -rf docs/dist",
"docs:deploy": "yarn docs && gh-pages -d docs/dist",
"docs": "esdoc && yarn test:coverage && node docs/post-doc",
"test": "NODE_ENV=test jest",
"test:coverage": "jest --coverage",
"test:watch": "jest --watch",
"watch": "watch-run -p 'src/**' yarn build",
"storybook": "start-storybook -p 6006",
"storybook:watch": "concurrently \"yarn watch\" \"yarn storybook\""
},
"jest": {
"coverageDirectory": "docs/dist/coverage"
},
"dependencies": {
"#storybook/addon-storysource": "^5.2.0",
"antd": "^3.23.3",
"axios": "^0.16.2",
"chance": "^1.0.13",
"classnames": "^2.2.6",
"lodash": "^4.17.4",
"md5": "^2.2.1",
"prop-types": "^15.7.2",
"react": "16.8",
"react-dom": "16.8",
"react-jss": "^8.6.1",
"store": "^2.0.12"
},
"devDependencies": {
"#babel/cli": "^7.6.0",
"#babel/core": "^7.6.0",
"#babel/plugin-proposal-class-properties": "^7.5.5",
"#babel/plugin-proposal-export-default-from": "^7.5.2",
"#babel/plugin-syntax-export-extensions": "^7.0.0-beta.32",
"#babel/plugin-transform-classes": "^7.5.5",
"#babel/preset-env": "^7.6.0",
"#babel/preset-react": "^7.0.0",
"#storybook/addon-actions": "^5.2.0",
"#storybook/addon-notes": "^5.2.1",
"#storybook/react": "^5.2.0",
"babel-loader": "^8.0.6",
"esdoc": "^1.0.3",
"esdoc-ecmascript-proposal-plugin": "^1.0.0",
"esdoc-react-plugin": "^1.0.1",
"esdoc-standard-plugin": "^1.0.0",
"flexbox-react": "^4.4.0",
"gh-pages": "^1.0.0",
"jest": "^24.9.0",
"pre-commit": "^1.2.2",
"react-popper-tooltip": "^2.8.3",
"react-test-renderer": "^16.9.0",
"react-textarea-autosize": "^7.1.0",
"simplebar-react": "^1.3.0-alpha.1",
"storybook-addon-react-docgen": "^1.2.18",
"url-loader": "^1.1.1",
"watch-run": "^1.2.5",
"webpack": "^4.40.2",
"webpack-cli": "^3.3.8"
},
"author": "",
"homepage": "",
"license": "MIT",
"repository": "",
"keywords": [
"react-component"
]
}
on master-branch react is defined as "devDependency", but on sub-branch as "dependency". I belive on sub-branch it also should be defined as "devDependency"
I have cloned a repo and did npm i. But as I ran it I was getting the above mentioned error on my console. So I tried a solution from this question and the error disappeared. But now the problem is that my app isn't loading I'm getting a blank page without any errors. I then removed the #babel/runtime dependecy. Here is my package.json:
{
//... some app info
"main": "dist/app.js",
"scripts": {
"clean": "rimraf dist",
"build": "yarn run clean && webpack-dashboard -- webpack --config configs/webpack.config.js --env.build --env.sourceMap",
"dev": "webpack-dashboard -m -- webpack-dev-server --config configs/webpack.config.js --open",
"dev2": "webpack-dashboard -m -- webpack-dev-server --config configs/webpack.config.js --open --env.awesome",
"lint": "tslint --project tsconfig.json",
"tsc": "tsc -p . --noEmit",
"tsc:watch": "tsc -p . --noEmit -w",
"test": "jest --config jest.json",
"test:update": "jest --config jest.json -u",
"reinstall": "rm -rf node_modules && yarn",
"reinstall:win": "rd /s /q node_modules && yarn",
"precommit": "yarn run lint",
"prepush": "yarn run lint & yarn run tsc & yarn run test",
"deploy": "echo 'deploy not set!'"
},
"dependencies": {
"classnames": "^2.2.5",
"csstips": "^0.2.0",
"firebase": "^4.8.0",
"ismobilejs": "^0.4.1",
"material-ui": "^0.19.4",
"numeral": "^2.0.6",
"radium": "^0.19.6",
"react": "16.1.1",
"react-dom": "16.1.1",
"react-firebase-storage-connector": "^1.1.0",
"react-redux": "5.0.6",
"react-stripe-elements": "^1.2.1",
"react-tooltip": "^3.4.0",
"redux": "3.7.2",
"redux-actions": "2.2.1",
"redux-form": "^7.2.0",
"redux-thunk": "^2.2.0",
"tslib": "1.6.1",
"typestyle": "^1.3.2"
},
"devDependencies": {
"#types/radium": "^0.18.23",
"#types/classnames": "^2.2.3",
"#types/firebase": "^2.4.32",
"#types/material-ui": "0.18.3",
"#types/node": "7.0.14",
"#types/react": "16.0.25",
"#types/react-dom": "16.0.3",
"#types/react-hot-loader": "^3.0.0-beta.7",
"#types/react-redux": "5.0.13",
"#types/redux-actions": "2.2.2",
"#types/redux-form": "^7.0.10",
"#types/webpack": "^2.2.15",
"#types/webpack-dev-server": "^1.12.6",
"#types/webpack-env": "^1.13.3",
"awesome-typescript-loader": "^3.4.1",
"css-loader": "^0.28.7",
"extract-text-webpack-plugin": "^3.0.1",
"file-loader": "^1.1.6",
"html-webpack-plugin": "^2.28.0",
"husky": "^0.13.3",
"jest": "^19.0.2",
"less": "^3.0.0-alpha.3",
"less-loader": "^4.0.5",
"postcss-loader": "^2.0.8",
"react-hot-loader": "^3.0.0-beta.6",
"redux-devtools-extension": "^2.13.2",
"rimraf": "^2.6.1",
"style-loader": "^0.19.1",
"ts-jest": "^19.0.14",
"ts-loader": "^2.0.3",
"tslint": "^5.1.0",
"tslint-react": "^3.0.0",
"typescript": "2.6.1",
"url-loader": "^0.6.2",
"webpack": "^2.2.1",
"webpack-dashboard": "^0.4.0",
"webpack-dev-server": "^2.9.7"
}
}
Quick fix: npm add #babel/runtime
I would like to use a development server just like React does with npm start. But, with Preact when I use the same command it opens a static server and I have to restart it manually each time when I want to see some change in my project.
My package.json:
{
"name": "yagoazedias-site",
"version": "0.0.0",
"description": "Ready-to-go Preact starter project powered by webpack.",
"scripts": {
"dev": "cross-env NODE_ENV=development webpack-dev-server --inline --hot --progress",
"start": "serve build -s -c 1",
"prestart": "npm run build",
"build": "cross-env NODE_ENV=production webpack --progress",
"prebuild": "mkdirp build && ncp src/assets build/assets",
"test": "npm run -s lint && jest --coverage",
"test:watch": "npm run -s test -- --watch",
"lint": "eslint src test"
},
"keywords": [
"preact",
"boilerplate",
"webpack"
],
"license": "MIT",
"author": "Jason Miller <jason#developit.ca>",
"jest": {
"setupFiles": [
"./test/setup.js"
],
"testURL": "http://localhost:8080",
"moduleFileExtensions": [
"js",
"jsx"
],
"moduleDirectories": [
"node_modules"
],
"moduleNameMapper": {
"\\.(jpg|jpeg|png|gif|eot|otf|webp|svg|ttf|woff|woff2|mp4|webm|wav|mp3|m4a|aac|oga)$": "<rootDir>/__mocks__/fileMock.js",
"\\.(css|less)$": "identity-obj-proxy",
"^react$": "preact-compat",
"^react-dom$": "preact-compat"
},
"collectCoverageFrom": [
"src/**/*.{js,jsx}"
]
},
"devDependencies": {
"autoprefixer": "^7.0.1",
"babel": "^6.5.2",
"babel-core": "^6.24.0",
"babel-eslint": "^7.2.2",
"babel-jest": "^20.0.0",
"babel-loader": "^7.0.0",
"babel-plugin-transform-decorators-legacy": "^1.3.4",
"babel-plugin-transform-react-jsx": "^6.8.0",
"babel-preset-es2015": "^6.24.0",
"babel-preset-stage-0": "^6.5.0",
"babel-register": "^6.24.0",
"babel-runtime": "^6.11.6",
"chai": "^4.0.2",
"copy-webpack-plugin": "^4.0.1",
"core-js": "^2.4.1",
"cross-env": "^5.0.1",
"css-loader": "^0.28.0",
"eslint": "^4.1.0",
"eslint-plugin-jest": "^20.0.0",
"eslint-plugin-react": "^7.0.0",
"extract-text-webpack-plugin": "^3.0.0",
"file-loader": "^0.11.1",
"html-webpack-plugin": "^2.28.0",
"identity-obj-proxy": "^3.0.0",
"jest": "^20.0.0",
"json-loader": "^0.5.4",
"less": "^2.7.1",
"less-loader": "^4.0.3",
"mkdirp": "^0.5.1",
"ncp": "^2.0.0",
"offline-plugin": "^4.7.0",
"postcss-loader": "^2.0.3",
"preact-jsx-chai": "^2.2.1",
"raw-loader": "^0.5.1",
"regenerator-runtime": "^0.10.3",
"replace-bundle-webpack-plugin": "^1.0.0",
"script-ext-html-webpack-plugin": "^1.3.4",
"sinon": "^2.1.0",
"sinon-chai": "^2.9.0",
"source-map-loader": "^0.2.1",
"style-loader": "^0.18.1",
"url-loader": "^0.6.1",
"webpack": "^3.0.0",
"webpack-dev-server": "^2.4.4"
},
"dependencies": {
"preact": "^8.1.0",
"preact-compat": "^3.15.0",
"preact-render-to-string": "^3.6.0",
"preact-router": "^2.5.1",
"promise-polyfill": "^6.0.2",
"proptypes": "^1.0.0",
"serve": "^6.0.0"
},
"main": "webpack.config.babel.js",
"directories": {
"test": "test"
}
}
Relevant links:
https://preactjs.com/
https://github.com/developit/preact
Use the dev script instead?
$ npm run dev
Your start script is doing serve build -s -c 1. React CRA's start script will boot up a webpack dev server which is what your dev script is doing.
npm start is short for npm run start. npm run <command> is just a small proxy that looks up the different commands you have listed in package.json.
Read more about npm scripts here.