Closed vcarel closed 2 years ago
mischnic
commented
3 years ago Can you go to this line:
/home/vianney/myproject/node_modules/@parcel/codeframe/lib/codeframe.js:214:44and comment it out? It should look like this highlightLine += highlighter('^'.repeat(characters))
Then you should hopefully at least see the actual error.
vcarel
commented
3 years ago Hi @mischnic, we had the same idea at the same time ^^
I just found the error! Parcel wanted to tell me that I was using a style which was undefined in my CSS module (for the record, it's in a JS file - that's why I didn't noticed it before)
The file is 294 lines long. The offending code was at line 249:
diff --git a/front/src/App/Main/Account/index.js b/front/src/App/Main/Account/index.js
index 0f5cb8d0..7337409d 100644
--- a/front/src/App/Main/Account/index.js
+++ b/front/src/App/Main/Account/index.js
@@ -249,7 +249,7 @@ const Account = ({ userUuid }) => {
</li>
</ul>
</nav>
- <div className={styles.tabContent}>
+ <div>
<div className={tab === "profile" ? null : "is-hidden"}>
<ProfileTab setPendingChanges={setPendingChanges} user={user} />
</div>Regarding the prettyDiagnostic problem: are you using a babelrc file or Flow?
Did I understand correctly that the error was actually correct and the bug is that is builds successfully on subsequent runs even though it should still fail?
vcarel
commented
3 years ago I don't have any babelrc or Flow. Just a few Typescript files, and Javascript files for the rest. The offending file was a JS one.
Did I understand correctly that the error was actually correct and the bug is that is builds successfully on subsequent runs even though it should still fail?
You are correct for the first part: the error was actually correct. However for the second part, I wouldn't expect the build to fail for just a warning.
To rephrase the observed behavior: the first time the file is built, the warning pops up and makes parcel to fail. The second time, the file is already built, and since there's no other warnings of that kind, it passes.
mischnic
commented
3 years ago The error here is the same error as the foo.js does not export 'something' error you get for JS-to-JS imports. And they should persist - they are also used for JS and CSS modules tree shaking.
I can reproduce that error-rebuild-success problem. It would be great if you could try to reduce the file causing the RangeError: Invalid count value error until you can share it.
vcarel
commented
3 years ago Sure, I'll do that tomorrow. It's midnight here already 🌃. Thanks for your help ! 😊
vcarel
commented
3 years ago @mischnic Here it is 🙂
mischnic
commented
3 years ago Perfect, thanks! I've opened another issue for the prettyDiagnostic problem: https://github.com/parcel-bundler/parcel/issues/7278
vcarel
commented
3 years ago Excellent! I'm closing this one then. Thanks again !
mischnic
commented
3 years ago Let's keep this one open for the bug that the error goes away on rebuilds: https://github.com/parcel-bundler/parcel/issues/7272#issuecomment-964621113
🐛 bug report
Build fails when the cache is empty. It works on 2nd try.
🎛 Configuration (.babelrc, package.json, cli command)
No .babelrc
tsconfig.json
```json { "$schema": "https://json.schemastore.org/tsconfig", "compilerOptions": { "allowJs": true, "allowSyntheticDefaultImports": true, "baseUrl": ".", "esModuleInterop": true, "forceConsistentCasingInFileNames": true, "isolatedModules": true, "jsx": "react-jsx", "lib": ["dom", "dom.iterable", "esnext"], "module": "esnext", "moduleResolution": "node", "noEmit": true, "noFallthroughCasesInSwitch": true, "resolveJsonModule": true, "skipLibCheck": true, "strict": false, "target": "es2021" }, "include": ["src"] } ```package.json
```json { "private": true, "homepage": "/", "dependencies": { "@auth0/auth0-react": "^1.6.0", "@fortawesome/fontawesome-svg-core": "^1.2.36", "@fortawesome/pro-duotone-svg-icons": "^5.15.4", "@fortawesome/pro-light-svg-icons": "^5.15.4", "@fortawesome/pro-regular-svg-icons": "^5.15.4", "@fortawesome/pro-solid-svg-icons": "^5.15.4", "@fortawesome/react-fontawesome": "^0.1.15", "@hookform/error-message": "^2.0.0", "@hookform/resolvers": "^2.8.0", "@popperjs/core": "^2.9.3", "@reduxjs/toolkit": "^1.6.1", "@sentry/browser": "^6.11.0", "@sentry/react": "^6.11.0", "@stripe/react-stripe-js": "^1.4.1", "@stripe/stripe-js": "^1.17.1", "async-mutex": "^0.3.1", "bulma": "^0.9.3", "bulma-steps": "^2.2.1", "date-fns": "^2.24.0", "date-fns-tz": "^1.1.6", "dexie": "^3.0.3", "highcharts": "^9.2.2", "highcharts-react-official": "^3.0.0", "lodash-es": "^4.17.21", "mapbox-gl": "1.13.0", "moment": "^2.29.1", "pica": "^7.1.0", "qrcode.react": "^1.0.1", "react": "^17.0.2", "react-dates": "^21.8.0", "react-dnd": "^14.0.3", "react-dnd-html5-backend": "^14.0.1", "react-dom": "^17.0.2", "react-easy-crop": "^3.5.2", "react-error-boundary": "^3.1.3", "react-highlight-words": "^0.17.0", "react-hook-form": "^7.13.0", "react-hotjar": "^3.0.1", "react-json-view": "^1.21.3", "react-popper": "^2.2.5", "react-query": "^3.26.0", "react-redux": "^7.2.4", "react-router-dom": "^5.3.0", "react-select": "^4.3.1", "react-swipeable": "^6.2.0", "react-toastify": "^7.0.4", "react-with-direction": "^1.3.1", "redux": "^4.1.1", "typescript": "^4.4.4", "yup": "^0.32.9" }, "lint-staged": { "*.+(js|jsx)": [ "eslint --fix" ], "*.scss": [ "stylelint --fix" ], "*.+(json|css|md)": [ "prettier --write" ] }, "alias": { "src": "./src" }, "source": "public/index.html", "scripts": { "analyze": "source-map-explorer build/static/js/*.js", "start": "parcel --port 3000 --open --dist-dir build", "sentry-release": "node ./sentry.js", "build": "parcel build --dist-dir build", "test": "jest", "typecheck": "tsc --noEmit", "lint": "eslint . && stylelint \"src/**/*.scss\"", "lintfix": "eslint --fix . && stylelint --fix \"src/**/*.scss\"", "postinstall": "rimraf .eslintcache", "serve": "serve -s build/ -p 3000", "prepare": "cd .. && husky install" }, "stylelint": { "extends": [ "stylelint-config-sass-guidelines", "stylelint-config-recess-order" ], "ignoreFiles": [ "**/*.js" ], "rules": { "function-parentheses-space-inside": null, "max-nesting-depth": null, "order/properties-alphabetical-order": null, "selector-max-compound-selectors": null, "scss/at-function-pattern": null, "scss/at-import-no-partial-leading-underscore": null, "scss/dollar-variable-pattern": null, "selector-class-pattern": null, "selector-no-qualifying-type": null, "string-quotes": null } }, "browserslist": { "production": [ ">0.5%", "last 2 chrome version", "last 2 firefox version", "last 2 safari version", "last 2 edge version", "not dead", "not op_mini all", "not ie > 0" ], "development": [ "last 1 chrome version", "last 1 firefox version", "last 1 safari version", "last 1 edge version" ] }, "devDependencies": { "@babel/core": "^7.16.0", "@babel/preset-env": "^7.16.0", "@babel/preset-typescript": "^7.16.0", "@babel/runtime": "^7.16.0", "@parcel/packager-raw-url": "^2.0.1", "@parcel/transformer-sass": "^2.0.1", "@parcel/transformer-webmanifest": "^2.0.1", "@sentry/cli": "^1.68.0", "@sentry/webpack-plugin": "^1.17.1", "@testing-library/jest-dom": "^5.15.0", "@testing-library/react": "^12.1.2", "@testing-library/user-event": "^13.5.0", "@types/jest": "^27.0.2", "@types/node": "^16.11.6", "@types/react": "^17.0.34", "@types/react-dom": "^17.0.11", "@typescript-eslint/eslint-plugin": "^5.3.0", "@typescript-eslint/parser": "^5.3.0", "babel-eslint": "^10.1.0", "babel-plugin-module-resolver": "^4.1.0", "eslint": "^7.32.0", "eslint-config-prettier": "^8.3.0", "eslint-config-react-app": "^6.0.0", "eslint-import-resolver-alias": "^1.1.2", "eslint-plugin-flowtype": "^5.9.0", "eslint-plugin-import": "^2.25.2", "eslint-plugin-jsx-a11y": "^6.3.1", "eslint-plugin-prettier": "^3.4.1", "eslint-plugin-react": "^7.26.1", "eslint-plugin-react-hooks": "^4.2.0", "eslint-plugin-sort-keys-fix": "^1.1.2", "husky": "^7.0.4", "jest": "^27.3.1", "lint-staged": "^11.2.6", "mock-file-server": "^0.1.17", "node-sass": "^6.0.1", "parcel": "^2.0.1", "prettier": "^2.4.1", "rimraf": "^3.0.2", "serve": "^13.0.2", "source-map-explorer": "^2.5.2", "stylelint": "^14.0.1", "stylelint-config-recess-order": "^2.5.0", "stylelint-config-sass-guidelines": "^9.0.1", "ts-node": "^10.4.0" } } ```🤔 Expected Behavior
It should build at first try.
😯 Current Behavior
It builds at 2nd try.
First try:
2nd try:
💁 Possible Solution
Something seems to be wrong with codeFrame / prettyDiagnostic.
Not a solution but a work-around: run the build twice 😅 e.g. in package.json:
🔦 Context
I'm trying to migrate quite a big app from create-react-app to parcel.
It happened when I replaced all my
import styles frombyimport * as stylesas suggested in parcel's warnings about treeshaking. When I revert this change, it works fine.💻 Code Sample
I can't share my code sorry :-/
🌍 Your Environment