Update 0.8-upgrade.md

This commit is contained in:
Juho Teperi 2018-06-16 01:01:15 +03:00 committed by GitHub
parent d9150856c0
commit f9723aab43
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
1 changed files with 19 additions and 22 deletions

View File

@ -7,20 +7,8 @@ how you want to provide React.
|---|---|---|---|
| Cljsjs | `:none` | Supported | Requires Cljs 1.10.238+ |
| Cljsjs | `:advanced` | Supported | Requires Cljs 1.10.238+ |
| `node modules` | `:none` | Known problems (1) | Supported |
| `node modules` | `:advanced` | Known problems (2) | Supported |
While Reagent 0.8 supports use with React from npm, there are known problems:
1. Closure can't properly handle React 16 CommonJS module pattern: https://github.com/google/closure-compiler/issues/2841
This causes the production React code being loaded even for development builds.
Using Chrome React Developer Tools with this setup will break Reagent. Fixed by `[com.google.javascript/closure-compiler-unshaded "v20180610"]` ([PR](https://github.com/google/closure-compiler/pull/2963)), will be
the included in next the ClojureScript release.
2. Closure optimization currently breaks certain statically created objects which are
accessed dynamically in `ReactDOM/server`: https://github.com/facebook/react/issues/12368
Fixed by using `[com.google.javascript/closure-compiler-unshaded "v20180319"]` ([fix commit](https://github.com/google/closure-compiler/commit/c13cf48b98477e44409dba6359246bffa95b1c7b)), will be
the default in next ClojureScript release.
| `node modules` | `:none` | Requires Cljs 1.10.312 | Supported |
| `node modules` | `:advanced` | Requires Cljs 1.10.312 | Supported |
## Browser - Cljsjs
@ -55,28 +43,23 @@ will in these cases rename the statically object properties, which will break
dynamically accessing the objects. Externs fix this by defining which properties
must not be renamed.
## Browser - loading React from CDNJS or custom Webpack bundle
## Browser - Webpack
**TODO: Not tested properly**
https://clojurescript.org/guides/webpack
If you want to load React.js yourself from external JS file (CDN) or from custom bundle,
it should be possible to override the Cljsjs foreign-libs, while still using externs from Cljsjs packages. To override the foreign-libs, you can provide following compiler option:
```clj
:foreign-libs
[{:file "empty.js",
[{:file "bundje.js",
:provides ["react" "react-dom" "create-react-class" "react-dom/server"],
:requires [],
:global-exports {react React
react-dom ReactDOM
create-react-class createReactClass
react-dom/server ReactDOMServer}}]
```
You'll also need to create the mentioned `empty.js` file (FIXME: relative to `project.clj`?).
If your bundle provides other libraries, you could extern `:provides` and `:global-exports` (e.g. `prop-types`).
## NodeJS - Cljsjs
Requires https://github.com/clojure/clojurescript/commit/f7d611d87f6ea8a605eae7c0339f30b79a840b49
@ -107,3 +90,17 @@ If you have one npm package installed, e.g. `react`, you also need
to provide others (`react-dom` and `create-react-class`), else
Cljsjs packages would be used for these, and packages from different sources
don't work together.
### Previous problems
Before ClojureScript 1.10.312 there were couple of problems with npm support:
1. Closure can't properly handle React 16 CommonJS module pattern: https://github.com/google/closure-compiler/issues/2841
This causes the production React code being loaded even for development builds.
Using Chrome React Developer Tools with this setup will break Reagent. Fixed by `[com.google.javascript/closure-compiler-unshaded "v20180610"]` ([PR](https://github.com/google/closure-compiler/pull/2963)), will be
the included in next the ClojureScript release.
2. Closure optimization currently breaks certain statically created objects which are
accessed dynamically in `ReactDOM/server`: https://github.com/facebook/react/issues/12368
Fixed by using `[com.google.javascript/closure-compiler-unshaded "v20180319"]` ([fix commit](https://github.com/google/closure-compiler/commit/c13cf48b98477e44409dba6359246bffa95b1c7b)), will be
the default in next ClojureScript release.