Fork me on GitHub
#reagent
<
2018-04-26
>
minikomi04:04:22

Can someone clear up how to use track to cache values? Is my thinking wrong about how it works?

minikomi04:04:28

I thought, the 2nd deref of the track generated value ( @y ) wouldn't call the function again, since the atom it relies on has not changed.

lilactown17:04:51

I think it works the opposite; that get-value-add-2 will guaranteed get called anytime x changes

lilactown17:04:06

I don't think it does anything to prevent additional executions

wombawomba11:04:40

I’m trying to hook up a reagent project to some react components from npm, but I can’t quite figure out how to get it working. AFAICT I have to add react to :npm-deps (so it can be resolved by other npm deps), so I’ve added

:install-deps true
:npm-deps     {"react"              "16.3.0"
               "react-dom"          "16.3.0"
               "create-react-class" "15.6.2"}
to my cljsbuild compiler options in project.clj (where I made sure to use the same versions that reagent 0.8.0 depends on). Everything compiles fine, but when I open it in a browser I get:
emptyObject.js:2 Uncaught ReferenceError: process is not defined
invariant.js:4 Uncaught ReferenceError: process is not defined
warning.js:4 Uncaught ReferenceError: process is not defined
checkPropTypes.js:10 Uncaught ReferenceError: process is not defined
react.development.js:9 Uncaught ReferenceError: process is not defined
react-dom.development.js:16 Uncaught ReferenceError: process is not defined
factory.js:33 Uncaught ReferenceError: process is not defined
react-highlight.inc.js:189 Uncaught ReferenceError: ReactDOM is not defined
Any idea what could be causing this? Am I missing something?

juhoteperi12:04:09

@wombawomba Looks like your are trying to use react-highlight from Cljsjs. Node packages and Cljsjs packages don't work together.

wombawomba13:04:25

@juhoteperi yeah, seems like I was depending on re-frame-10x, which had a dependency on that package

juhoteperi13:04:35

Re-frame-10x is not currently usable, easily anyway, with Node modules: https://github.com/Day8/re-frame-10x/issues/188

wombawomba13:04:49

Okay so I managed to get rid of the above errors by manually defining process.env.NODE_ENV and by getting rid of re-frame-10x, but now I’m seeing other errors:

index.js:4 Uncaught Error: ^_^
    at checkDCE$$module$path_to_project$node_modules$react_dom$index (index.js:4)
    at index.js:5
index.js:20 Uncaught ReferenceError: module is not defined
    at index.js:20
dom.cljs?rel=1524747962029:20 Uncaught TypeError: Cannot read property 'render' of undefined
    at reagent$dom$render_comp (dom.cljs?rel=1524747962029:20)

Any idea what could be causing these?

juhoteperi13:04:48

Known issue with Google Closure-Compiler and React 16. https://github.com/google/closure-compiler/issues/2841

juhoteperi13:04:38

Closure-compiler is not able to handle the React 16 CJS bundle correctly, it will use React production code even in development mode and Chrome React-developer tools has a check to detect this problem.

juhoteperi13:04:38

As a workaround you can disable React-developer tools, in that case you don't see this error, but the app will use React 16 prod code which means you lose some React validations that are only enable in development build.

juhoteperi13:04:32

No fix for ClojureScript node module support until Closure-compiler is fixed. Shadow-CLJS will work as it doesn't use Closure-compiler for this.

wombawomba13:04:12

alternatively, could downgrading to react 15 fix this issue? afaik I don’t rely on anything from react 16

juhoteperi13:04:38

Yes, that should work. It doesn't use the CJS bundle which causes the problems.

wombawomba13:04:56

Alright, downgrading worked, Thanks @juhoteperi 🙂

wombawomba13:04:36

I am still getting the following error, although it doesn’t seem to break anything:

index.js:20 Uncaught ReferenceError: module is not defined
    at index.js:20
Any idea what the cause might be? index.js is compiled, so it’s hard to tell exactly what’s going on in the code.

wombawomba13:04:59

The error seems to be in

var freeModule$$module$project_path$node_modules$lodash_isequal$index=freeExports$$module$project_path$node_modules$lodash_isequal$index&&"object"=="object"&&module&&!module.nodeType&&module

wombawomba13:04:34

Actually, that seems to be specific to a npm dependency I was trying to add. Nevermind

lilactown17:04:17

(whispers) just use shadow-cljs

😁 4
javi17:04:01

+ 100 (wishpers) on shadow-cljs... i do mostly cljs and it has accelerated my workflow by a factor of 1000

wombawomba17:04:28

why shadow-cljs?

juhoteperi17:04:15

@wombawomba It uses different solution for supporting Node packages which is much more robust than the solution in ClojureScript compiler

mikerod18:04:12

I think it is a reasonable compromise in certain situations between shadow-cljs vs npm-modules of cljs

wombawomba23:04:18

alright, will do