search

atlassian / react-sweet-state

Shared state management solution for React
https://atlassian.github.io/react-sweet-state/
MIT License
871 stars 55 forks source link

react-sweet-state ie11 compatibility #128

Closed LancelotLai closed 3 years ago

LancelotLai commented 3 years ago

Is the module should be developed in es5 module?

due to the lack of babel function, react-sweet-state does not work at ie11 in next js environment, thank you.

LancelotLai commented 3 years ago

"next": "10.0.5", "react": "16.13.1", "react-sweet-state": "^2.3.0"

SCRIPT1002: Syntax error in IE 11

package.json in react-sweet-state node module:

{ "_from": "react-sweet-state@^2.3.0", "_id": "react-sweet-state@2.5.2", "_inBundle": false, "_integrity": "sha512-iMEhwhJSAOpfdgpHfWX/W4JcLyc7fvfaeACsCiDpn+xXrVGrncHTLeKiNHqPHhEpRZHJLmKIleFal6KrL8ZpMw==", "_location": "/react-sweet-state", "_phantomChildren": {}, "_requested": { "type": "range", "registry": true, "raw": "react-sweet-state@^2.3.0", "name": "react-sweet-state", "escapedName": "react-sweet-state", "rawSpec": "^2.3.0", "saveSpec": null, "fetchSpec": "^2.3.0" }, "_requiredBy": [ "/" ], "_resolved": "https://registry.npmjs.org/react-sweet-state/-/react-sweet-state-2.5.2.tgz", "_shasum": "ec220bfe08acc5eb8d957454dcb4a00e9e179107", "_spec": "react-sweet-state@^2.3.0", "_where": "/Users/lancelotlai/Desktop/MadMadGroup.nosync/pbhk/front-end", "author": { "name": "Alberto Gasparin" }, "bugs": { "url": "https://github.com/atlassian/react-sweet-state/issues" }, "bundleDependencies": false, "dependencies": {}, "deprecated": false, "description": "Global + local state combining the best of Redux and Context API", "devDependencies": { "@babel/cli": "^7.12.8", "@babel/core": "^7.12.9", "@babel/plugin-proposal-class-properties": "^7.12.1", "@babel/plugin-proposal-export-namespace-from": "^7.12.1", "@babel/plugin-syntax-dynamic-import": "^7.8.3", "@babel/plugin-syntax-import-meta": "^7.10.4", "@babel/plugin-transform-runtime": "^7.12.1", "@babel/polyfill": "^7.12.1", "@babel/preset-env": "^7.12.7", "@babel/preset-flow": "^7.12.1", "@babel/preset-react": "^7.12.7", "@babel/runtime": "^7.12.5", "@types/react": "^16.14.2", "@types/react-dom": "^16.9.10", "@typescript-eslint/eslint-plugin": "^2.34.0", "@typescript-eslint/parser": "^2.34.0", "babel-eslint": "^10.1.0", "babel-jest": "^26.6.3", "babel-loader": "^8.2.2", "dtslint": "^0.9.9", "enzyme": "^3.11.0", "enzyme-adapter-react-16": "^1.15.5", "eslint": "^7.14.0", "eslint-config-prettier": "^6.15.0", "eslint-plugin-flowtype": "^5.2.0", "eslint-plugin-import": "^2.22.1", "eslint-plugin-jest": "^24.1.3", "eslint-plugin-prettier": "^3.1.4", "eslint-plugin-react": "^7.21.5", "eslint-plugin-react-hooks": "^4.2.0", "flow-bin": "^0.138.0", "flow-copy-source": "^2.0.9", "jest": "^26.6.3", "prettier": "^2.2.1", "prop-types": "^15.7.2", "react": "^16.14.0", "react-dom": "^16.14.0", "typescript": "^3.9.7", "webpack": "^4.44.2", "webpack-cli": "^3.3.12", "webpack-dev-server": "^3.11.0" }, "homepage": "https://github.com/atlassian/react-sweet-state#readme", "keywords": [ "React", "React Context", "state management", "Redux" ], "license": "MIT", "main": "lib/cjs/index.js", "module": "lib/esm/index.js", "name": "react-sweet-state", "peerDependencies": { "prop-types": "^15.0.0", "react": "^16.9.0 || ^17.0.0-0", "scheduler": "*" }, "peerDependenciesMeta": { "react-dom": { "optional": true }, "react-native": { "optional": true } }, "repository": { "type": "git", "url": "git+https://git@github.com/atlassian/react-sweet-state.git" }, "scripts": { "build": "npm run clean:build -s && npm run build:cjs -s && npm run build:esm -s && npm run build:flow -s", "build:cjs": "babel src/ -d lib/cjs --ignore /tests --presets @babel/env", "build:esm": "babel src/ -d lib/esm --ignore /tests", "build:flow": "echo lib/cjs lib/esm | xargs -n 1 cp src/index.js.flow", "clean:build": "rm -rf ./lib", "docs": "npx docsify-cli serve docs", "lint": "eslint ./src", "perf:start": "webpack-dev-server --config ./webpack.config.perf.js", "prepack": "npm run preversion -s && npm run build -s", "preversion": "npm run lint -s && npm run types -s && npm run test -s", "start": "webpack-dev-server", "test": "jest", "types": "dtslint --expectOnly --localTs node_modules/typescript/lib ./types && tsc && flow --max-warnings=0" }, "sideEffects": false, "types": "./types/index.d.ts", "version": "2.5.2" }

albertogasparin commented 3 years ago

Sorry for this annoyance but we realised IE11 it's basically gone so having all RSS consumers bundling helpers to support it was an unnecessary burden (in terms of library bundle size). So since version v2.5.2 we have updated our babel config to support only last 2 current browser versions and Edge 18+ on the npm published files, with arrow functions, let/const (plus a bunch of other things) no longer transpiled.

But you can easily fix that by having babel processing your node modules, for instance adding to your babel config an exclusion that makes babel transpile RSS:

exclude: /node_modules\/(?!(react-sweet-state)\/).*/

That way you can keep RSS compatible with IE11.