Blank page with npm start #9152
Unanswered
sunilsharma2214
asked this question in
Q&A
Replies: 1 comment
-
|
Beta Was this translation helpful? Give feedback.
0 replies
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Uh oh!
There was an error while loading. Please reload this page.
-
Hi All, I am working on a datepicker component package using npm publish, somehow it working as expected and I am able to use this package in other applications too. but, when I am doing npm start on datepicker CRA application, I am getting a blank page without any console error.
package.json
{
"name": "Datepicker",
"version": "0.3.2",
"main": "dist/index.js",
"types": "dist/index.d.ts",
"dependencies": {
"classnames": "2.2.5",
"react-scripts": "3.4.0",
"axios": "^0.18.0"
},
"peerDependencies": {
"react": ">=16.8.0",
"react-dom": ">=16.8.0",
"typescript": "^3.7.5"
},
"husky": {
"hooks": {
"pre-commit": "lint-staged"
}
},
"lint-staged": {
"src//*.{js,jsx,tsx,}": [
"npm run lint:ts",
"git add"
]
},
"scripts": {
"start": "react-scripts start",
"build": "npm run build:lib",
"build:lib": "babel-node scripts/build.js",
"test": "react-scripts test",
"eject": "react-scripts eject",
"lint:ts": "eslint src//.{js,ts,jsx} --fix",
"lint:css": "stylelint src/**/.css --fix"
},
"eslintConfig": {
"extends": "react-app"
},
"devDependencies": {
"@testing-library/jest-dom": "^4.2.4",
"@testing-library/react": "^9.5.0",
"@testing-library/user-event": "^7.2.1",
"@types/jest": "^24.9.1",
"@types/node": "^12.12.30",
"@types/react": "^16.9.23",
"@types/react-dom": "^16.9.5",
"@types/classnames": "2.2.3",
"stylelint": "13.3.0",
"stylelint-config-css-modules": "^2.2.0",
"stylelint-config-standard": "^20.0.0",
"tslint": "^6.1.1",
"prettier": "^2.0.2",
"eslint": "^5.16.0",
"eslint-config-prettier": "^6.0.0",
"eslint-plugin-import": "^2.18.2",
"eslint-plugin-prettier": "^3.1.0",
"eslint-plugin-react": "^7.14.3",
"husky": "^4.2.3",
"lint-staged": "^9.2.5",
"@typescript-eslint/eslint-plugin": "^2.26.0",
"@typescript-eslint/parser": "^2.26.0",
"babel-cli": "6.26.0",
"babel-preset-env": "^1.7.0",
"bluebird": "3.5.1",
"fs-extra": "^7.0.0",
"glob": "^7.1.2",
"typescript": "^3.7.5",
"react": "^16.13.1",
"react-dom": "^16.13.1",
"core-js": "^3.6.4",
"@types/core-js": "^2.5.3"
},
"author": "ABC",
"license": "UNLICENSED",
"repository": {
"type": "git",
"url": ""
},
"browserslist": {
"production": [
">0.2%",
"not dead",
"not op_mini all"
],
"development": [
"last 1 chrome version",
"last 1 firefox version",
"last 1 safari version"
]
}
}
tsconfig.json
{
"compilerOptions": {
"baseUrl": "src/",
"experimentalDecorators": true,
"module": "esnext",
"target": "es5",
"lib": [
"es2017",
"dom"
],
"strictPropertyInitialization": false,
"sourceMap": true,
"allowJs": true,
"jsx": "react",
"moduleResolution": "node",
"rootDir": "src",
"forceConsistentCasingInFileNames": true,
"noImplicitReturns": true,
"noImplicitThis": true,
"noImplicitAny": true,
"strictNullChecks": true,
"suppressImplicitAnyIndexErrors": true,
"skipLibCheck": true,
"allowSyntheticDefaultImports": true,
"esModuleInterop": false,
"strict": true,
"resolveJsonModule": true,
"isolatedModules": true,
"noEmit": true,
"downlevelIteration": true
},
"exclude": [
"node_modules",
"dist",
"scripts",
"webpack",
"jest",
"src/setupTests.ts",
"src/index.tsx",
],
"include": [
"src"
]
}
tsconfig-build.json - used by build.js(npm build)
{
"compilerOptions": {
"baseUrl": ".",
"target": "es5",
"lib": [
"es2017",
"dom"
],
"declaration": true,
"sourceMap": true,
"jsx": "react",
"moduleResolution": "node",
"rootDir": "src",
"forceConsistentCasingInFileNames": true,
"noImplicitReturns": true,
"noImplicitThis": true,
"noImplicitAny": true,
"strictNullChecks": true,
"suppressImplicitAnyIndexErrors": true,
"noUnusedLocals": true,
"noUnusedParameters": true,
"allowSyntheticDefaultImports": true,
},
"exclude": [
"node_modules",
"dist",
"scripts",
"webpack",
"jest",
"src/setupTests.ts",
"src/index.tsx",
]
}
index.tsx
import React from 'react';
import ReactDOM from 'react-dom';
import Datepicker from './Datepicker'
ReactDOM.render(, rootHTMLElement);
Beta Was this translation helpful? Give feedback.
All reactions