Closed abocanegrab closed 2 months ago
I have a project using library rc-slider, internally has a dependency with classnames.
Reviewing my build I saw an unnecessary size of the js. Reviewing deeper with source-map-explorer package, I found I have a 4mb classnames js file.
This is my package json file:
{"dependencies": { "aws-amplify": "^6.5.3", "aws-sdk": "^2.1687.0", "build": "^0.1.4", "crypto": "^1.0.1", "html-react-parser": "^5.1.15", "js-cookie": "^3.0.5", "jwt-decode": "^4.0.0", "lodash.throttle": "^4.1.1", "moment": "^2.30.1", "moment-timezone": "^0.5.45", "path-browserify": "^1.0.1", "rc-slider": "^11.1.5", "react": "^18.3.1", "react-detect-click-outside": "^1.1.7", "react-dom": "^18.3.1", "react-icons": "^5.3.0", "react-router-dom": "^6.26.1", "react-select": "^5.8.0", "react-toastify": "^10.0.5", "zod": "^3.22.4" }, "devDependencies": { "@fullhuman/postcss-purgecss": "^6.0.0", "@types/js-cookie": "^3.0.6", "@types/lodash.throttle": "^4.1.9", "@types/node": "^22.5.2", "@types/react": "^18.3.5", "@types/react-dom": "^18", "@types/react-slider": "^1.3.6", "autoprefixer": "^10.4.20", "husky": "^9.1.5", "lint-staged": "^15.2.10", "postcss": "^8.4.44", "postcss-cli": "^11.0.0", "prettier": "^3.3.3", "react-app-rewired": "^2.2.1", "react-scripts": "^5.0.1", "tailwindcss": "^3.4.10", "terser-webpack-plugin": "^5.3.10", "typescript": "^5.5.4" }}
I tried many ways, but the build don't reduce the size.
Somebody could give me some guidance?
That cannot be right, classnames is about 752 bytes. This must be a bug in your bundler, or the tooling used to report it, perhaps a visualization bug.
classnames
I have a project using library rc-slider, internally has a dependency with classnames.
Reviewing my build I saw an unnecessary size of the js. Reviewing deeper with source-map-explorer package, I found I have a 4mb classnames js file.
This is my package json file:
{"dependencies": { "aws-amplify": "^6.5.3", "aws-sdk": "^2.1687.0", "build": "^0.1.4", "crypto": "^1.0.1", "html-react-parser": "^5.1.15", "js-cookie": "^3.0.5", "jwt-decode": "^4.0.0", "lodash.throttle": "^4.1.1", "moment": "^2.30.1", "moment-timezone": "^0.5.45", "path-browserify": "^1.0.1", "rc-slider": "^11.1.5", "react": "^18.3.1", "react-detect-click-outside": "^1.1.7", "react-dom": "^18.3.1", "react-icons": "^5.3.0", "react-router-dom": "^6.26.1", "react-select": "^5.8.0", "react-toastify": "^10.0.5", "zod": "^3.22.4" }, "devDependencies": { "@fullhuman/postcss-purgecss": "^6.0.0", "@types/js-cookie": "^3.0.6", "@types/lodash.throttle": "^4.1.9", "@types/node": "^22.5.2", "@types/react": "^18.3.5", "@types/react-dom": "^18", "@types/react-slider": "^1.3.6", "autoprefixer": "^10.4.20", "husky": "^9.1.5", "lint-staged": "^15.2.10", "postcss": "^8.4.44", "postcss-cli": "^11.0.0", "prettier": "^3.3.3", "react-app-rewired": "^2.2.1", "react-scripts": "^5.0.1", "tailwindcss": "^3.4.10", "terser-webpack-plugin": "^5.3.10", "typescript": "^5.5.4" }}
I tried many ways, but the build don't reduce the size.
Somebody could give me some guidance?