[#CLJS-2677] Better handling of npm-deps via REPL require when output-dir not specified - Clojure JIRA

Details

Type: Enhancement
Status: Open
Priority: Major
Resolution: Unresolved
Affects Version/s: None
Fix Version/s: None
Component/s: None
Labels:
- npm-deps
Environment:
{:deps {org.clojure/clojurescript {:mvn/version "1.10.217"}}}

Description

I'm speculating that the following doesn't work because Closure is not involved when requiring at the REPL.

co.edn

{:output-dir "out"
 :output-to "out/main.js"
 :optimizations :none
 :install-deps true
 :npm-deps {:react "15.6.1"
            :react-dom "15.6.1"}}

src/example/core.cljs

(ns example.core
  (:require [react :refer [createElement]]
            ["react-dom/server" :as ReactDOMServer :refer [renderToString]]))

(js/console.log (renderToString (createElement "div" nil "Hello World!")))

This works fine:

clj -m cljs.main -co co.edn -c example.core -r

logging this in the browser console

[Log] <div data-reactroot="" data-reactid="1" data-react-checksum="1309021079">Hello World!</div> (core.js, line 6)

But if instead you start off fresh (without out, node_modules, package.json and package-lock.json) and do

clj -m cljs.main -co co.edn -r

followed by this in the REPL:

(require 'example.core)

No errors are shown in the REPL console, but the JavaScript console shows lots of errors.

I think to satisfy this ticket this could either be made to "just work" somehow, or perhaps instead the problem could be detected and an ex-info thrown letting the user know that things won't work this way.

Here are the errors logged:

[Error] ReferenceError: Can't find variable: process
	Global Code (warning.js:4)
[Error] ReferenceError: Can't find variable: process
	Global Code (canDefineProperty.js:2:170)
[Error] ReferenceError: Can't find variable: process
	Global Code (emptyObject.js:2:153)
[Error] ReferenceError: Can't find variable: process
	Global Code (invariant.js:4:192)
[Error] ReferenceError: Can't find variable: process
	Global Code (lowPriorityWarning.js:3)
[Error] ReferenceError: Can't find variable: process
	Global Code (ReactBaseClasses.js:16)
[Error] ReferenceError: Can't find variable: process
	Global Code (ReactPropTypeLocationNames.js:2:185)
[Error] ReferenceError: Can't find variable: process
	Global Code (ReactDOMFactories.js:5)
[Error] ReferenceError: Can't find variable: process
	Global Code (checkPropTypes.js:10)
[Error] ReferenceError: Can't find variable: process
	createChainableTypeChecker (factoryWithTypeCheckers.js:12:305)
	createPrimitiveTypeChecker (factoryWithTypeCheckers.js:17:102)
	(anonymous function) (factoryWithTypeCheckers.js:10:535)
	(anonymous function) (factory.js:3:441)
	Global Code (ReactPropTypes.js:5:149)
[Error] ReferenceError: Can't find variable: process
	Global Code (factory.js:34:317)
[Error] ReferenceError: Can't find variable: process
	Global Code (React.js:18)
[Error] ReferenceError: Can't find variable: process
	Global Code (EventPluginRegistry.js:16:218)
[Error] ReferenceError: Can't find variable: process
	Global Code (ReactErrorUtils.js:5)
[Error] ReferenceError: Can't find variable: process
	Global Code (EventPluginUtils.js:12)
[Error] TypeError: undefined is not an object (evaluating 'module$private$tmp$island$node_modules$react_dom$lib$EventPluginRegistry["default"].injectEventPluginOrder')
	Global Code (EventPluginHub.js:16:199)
[Error] TypeError: undefined is not an object (evaluating 'module$private$tmp$island$node_modules$react_dom$lib$EventPluginHub["default"].getListener')
	Global Code (EventPropagators.js:9:167)
[Error] ReferenceError: Can't find variable: process
	Global Code (SyntheticEvent.js:18)
[Error] TypeError: undefined is not a function (near '...module$private$tmp$island$node_modules$react_dom$lib$SyntheticEvent["default"].augmentClass...')
	Global Code (SyntheticCompositionEvent.js:4:393)
[Error] TypeError: undefined is not a function (near '...module$private$tmp$island$node_modules$react_dom$lib$SyntheticEvent["default"].augmentClass...')
	Global Code (SyntheticInputEvent.js:4:203)
[Error] ReferenceError: Can't find variable: process
	Global Code (DOMProperty.js:14:471)
[Error] TypeError: undefined is not an object (evaluating 'module$private$tmp$island$node_modules$react_dom$lib$DOMProperty["default"].ID_ATTRIBUTE_NAME')
	Global Code (ReactDOMComponentTree.js:7:516)
[Error] ReferenceError: Can't find variable: process
	Global Code (ReactInvalidSetStateWarningHook.js:4)
[Error] ReferenceError: Can't find variable: process
	Global Code (ReactInstrumentation.js:4)
[Error] TypeError: undefined is not a function (near '...module$private$tmp$island$node_modules$react_dom$lib$SyntheticEvent["default"].augmentClass...')
	Global Code (SyntheticUIEvent.js:7:93)
[Error] TypeError: undefined is not a function (near '...module$private$tmp$island$node_modules$react_dom$lib$SyntheticUIEvent["default"].augmentClass...')
	Global Code (SyntheticMouseEvent.js:9:95)
[Error] TypeError: undefined is not an object (evaluating 'module$private$tmp$island$node_modules$react_dom$lib$DOMProperty["default"].injection')
	Global Code (HTMLDOMPropertyConfig.js:3:425)
[Error] ReferenceError: Can't find variable: process
	Global Code (DOMChildrenOperations.js:21)
[Error] TypeError: undefined is not an object (evaluating 'module$private$tmp$island$node_modules$react_dom$lib$DOMChildrenOperations["default"].dangerouslyReplaceNodeWithMarkup')
	Global Code (ReactComponentBrowserEnvironment.js:5:349)
[Error] ReferenceError: Can't find variable: process
	Global Code (CSSPropertyOperations.js:17)
[Error] TypeError: undefined is not an object (evaluating 'module$private$tmp$island$node_modules$react_dom$lib$DOMProperty["default"].ATTRIBUTE_NAME_START_CHAR')
	Global Code (DOMPropertyOperations.js:9:200)
[Error] TypeError: undefined is not an object (evaluating 'module$private$tmp$island$node_modules$react$lib$React["default"].isValidElement')
	Global Code (LinkedValueUtils.js:9:533)
[Error] ReferenceError: Can't find variable: process
	Global Code (ReactPropTypeLocationNames.js:2:193)
[Error] ReferenceError: Can't find variable: process
	Global Code (ReactCompositeComponent.js:21:366)
[Error] ReferenceError: Can't find variable: process
	Global Code (ReactMultiChild.js:21)
[Error] ReferenceError: Can't find variable: process
	Global Code (ReactServerRenderingTransaction.js:10:126)
[Error] ReferenceError: Can't find variable: process
	Global Code (validateDOMNesting.js:7)
[Error] TypeError: undefined is not an object (evaluating 'module$private$tmp$island$node_modules$react_dom$lib$EventPluginHub["default"].deleteListener')
	Global Code (ReactDOMComponent.js:42:171)
[Error] TypeError: undefined is not an object (evaluating 'module$private$tmp$island$node_modules$react_dom$lib$DOMProperty["default"].injection')
	Global Code (ReactInjection.js:13:279)
[Error] ReferenceError: Can't find variable: process
	Global Code (ReactReconcileTransaction.js:18)
[Error] TypeError: undefined is not a function (near '...module$private$tmp$island$node_modules$react_dom$lib$SyntheticEvent["default"].augmentClass...')
	Global Code (SyntheticAnimationEvent.js:4:256)
[Error] TypeError: undefined is not a function (near '...module$private$tmp$island$node_modules$react_dom$lib$SyntheticEvent["default"].augmentClass...')
	Global Code (SyntheticClipboardEvent.js:4:303)
[Error] TypeError: undefined is not a function (near '...module$private$tmp$island$node_modules$react_dom$lib$SyntheticUIEvent["default"].augmentClass...')
	Global Code (SyntheticFocusEvent.js:4:214)
[Error] TypeError: undefined is not a function (near '...module$private$tmp$island$node_modules$react_dom$lib$SyntheticUIEvent["default"].augmentClass...')
	Global Code (SyntheticKeyboardEvent.js:10:95)
[Error] TypeError: undefined is not a function (near '...module$private$tmp$island$node_modules$react_dom$lib$SyntheticMouseEvent["default"].augmentClass...')
	Global Code (SyntheticDragEvent.js:4:214)
[Error] TypeError: undefined is not a function (near '...module$private$tmp$island$node_modules$react_dom$lib$SyntheticUIEvent["default"].augmentClass...')
	Global Code (SyntheticTouchEvent.js:6:95)
[Error] TypeError: undefined is not a function (near '...module$private$tmp$island$node_modules$react_dom$lib$SyntheticEvent["default"].augmentClass...')
	Global Code (SyntheticTransitionEvent.js:4:257)
[Error] TypeError: undefined is not a function (near '...module$private$tmp$island$node_modules$react_dom$lib$SyntheticMouseEvent["default"].augmentClass...')
	Global Code (SyntheticWheelEvent.js:5:98)
[Error] TypeError: undefined is not an object (evaluating 'module$private$tmp$island$node_modules$react_dom$lib$ReactInjection["default"].EventEmitter')
	inject (ReactDefaultInjection.js:22:383)
	Global Code (ReactDOMServer.js:6:257)
[Error] TypeError: undefined is not an object (evaluating 'module$private$tmp$island$node_modules$react_dom$server["default"].renderToString')
	Global Code (core.js:6)

Activity

Hide

Permalink

David Nolen added a comment - 20/Mar/18 9:59 AM - edited

You must set :output-dir if you intend to use :npm-deps for now. If we somehow figure out a way to make this work, it also needs to work with Node.js if you do not supply :output-dir.

Show

David Nolen added a comment - 20/Mar/18 9:59 AM - edited You must set :output-dir if you intend to use :npm-deps for now. If we somehow figure out a way to make this work, it also needs to work with Node.js if you do not supply :output-dir.

People

Assignee:

Unassigned

Reporter:

Mike Fikes

Vote (0)

Watch (0)

Dates

Created:

20/Mar/18 8:03 AM

Updated:

25/Apr/18 5:17 PM

ClojureScript

Better handling of npm-deps via REPL require when output-dir not specified

Details

Description

Activity

People

Dates