Fork me on GitHub
#shadow-cljs
<
2020-01-30
>
jmckitrick00:01:01

Not long ago, it was suggested when using a luminus template with shadow, to remove the key from the project file and not use lein-shadow, What’s the recommended process to build the CLJS part of the uberjar?

dpsutton00:01:21

shadow-cljs release app

dpsutton00:01:31

probably in your project.clj is still the instructions for the uberjar step and it just calls exactly that (or whatever incantation causes the plugin to call exactly that)

jmckitrick00:01:04

Oh, ok. Then uberjar will wrap that up, and it’s deployable as-is?

dpsutton00:01:20

sorta. the uberjar used to call out to the plugin. but just make it call out to shadow tocompile or make a script that calls shadow-cljs release app && lein uberjar. Two steps you need to do: compile your js and build a jar. how you get there is straight forward. if lein can just shell out you can do that. otherwise, ensure the build is present and then uberjar as normal. check the jar that your stuff is there and then never worry about this again

jmckitrick12:01:58

I’ll try that, thanks. Like you said, the manual steps aren’t the issue, it’s getting lein to do it at the same time. I’ll figure it out.

Philipp Siegmantel07:01:33

Hello. I want to write a part of my application in typescript, but js file imports don't seem to work for me. My source tree looks like this.

.
├── clj
├── cljs
│   ├── client
│   │   └── exercises
│   └── test
│       └── client
├── gen
│   └── client
└── ts
    └── client
I need to require something from gen/client in the client.exercises.two namespace. I tried every variant of "./file", "./file.js", "/client/file", "client/file" and so on I can think of. My shadow-cljs.edn's :source-paths is ["src/cljs" "src/clj" "src/gen"]. I'm probably making an obvious mistake, but can somebody point it out for me?

thheller08:01:39

@philipp.siegmantel if you are in client.exercises.two namespace you are in the /client/exercises/two.cljs file so ../file.js or /client/file.js should work. (extension is required. not optional)

Philipp Siegmantel11:01:12

@thheller I still can't require the js file. The concrete error message I get is

The required JS dependency "../boxes.js" is not available, it was required by "client/exercises/two.cljs".
or
The required JS dependency "/client/boxes.js" is not available, it was required by "client/exercises/two.cljs".
There is definitely a file named boxes.js in the right location.
gen
└── client
    └── boxes.js
Is there anything else I could have gotten wrong?

Philipp Siegmantel11:01:50

Also the documentation says that the .js extension is optional, maybe this should be updated. https://shadow-cljs.github.io/docs/UsersGuide.html#_requiring_js

andrewzhurov11:01:24

@thheller Is it a sane design to have a shadow-cljs project-A depend on the source files of another shadow-cljs project-B? I am facing the need to create a custom build of a ReactJS component, to pack it into a stand-alone project would add up to granularity, seemed like a good idea.. However, 'project B' has node dependencies and when

project-A/deps.edn

{:deps {project-B {:local/root <path-to-project-B>}}}
project-A$ yarn
=> Installed dependencies of Project-A

project-A$ shadow-cljs watch dev
=> The required JS dependency <a-dependency-of-Project-B> is not available
=> Searched in:/<path-to-projects>/project-A/node_modules

thheller12:01:32

@philipp.siegmantel only other thing I can think of is that the .js file fails parsing and the error is lost somewhere

thheller12:01:22

make sure its valid JS without stage0 features

thheller12:01:39

@brownmoose3q in project-b you can add a deps.cljs in your source path that includes {:npm-deps {"the-npm-dep" "version"}}

✔️ 4
👍 4
andrewzhurov14:01:59

Works, thanks! Found it also had been discussed here: https://github.com/thheller/shadow-cljs/issues/403

Philipp Siegmantel12:01:16

@thheller the js file is simply

function hello() {
  console.log("Hello World from TypeScript!");
}
Should I report a bug?

thheller12:01:09

if you reproduce it in a sample project first

thheller12:01:55

pretty sure the file needs some exports too

Philipp Siegmantel12:01:18

I already tried an export default line, makes no difference.

Philipp Siegmantel12:01:46

I will hack around for a bit, thank you for your help.

thheller12:01:32

just tested it and it is working fine

thheller12:01:18

you did add the source path and restart after doing so right?

Philipp Siegmantel13:01:01

I just put together a minimal example that fails for me. give me a moment to create a repo.

Philipp Siegmantel13:01:40

And yes, I restarted and upgraded shadow-cljs with no effect.

thheller14:01:57

ok .. thats it .. I'm adding a big fat warning ...

thheller14:01:25

@philipp.siegmantel if you use :lein true then :source-paths in shadow-cljs.edn has no effect whatsoever and you need to configure it in project.clj instead

Philipp Siegmantel14:01:50

Then it was simply my ignorance. Thank you for helping. Shadow-cljs is a great pice of software.

jeeq15:01:35

@thheller I was going through your babel example (https://github.com/shadow-cljs/examples/tree/master/babel) just now and found that checked in generated js (gen/demo/bar.js) is able to be used by shadow-cljs correctly and I’m able to load the page. However once I “npm run build” to generate new bar.js on my computer it seems to generate different js and gives me error (similar to what I saw yesterday on my project). I didn’t change anything in the example app. My babel’d js:

import React from "react";

var MyComponent = function MyComponent(_ref) {
  var key = _ref.key;

  console.log('child props', key);
  return React.createElement(
    "li",
    { key: key },
    "Hello JSX!"
  );
};

var MyDefaultComponent = function MyDefaultComponent(_ref2) {
  var children = _ref2.children;
  return React.createElement(
    "div",
    null,
    React.createElement(
      "h1",
      null,
      "Hello JSX!"
    ),
    React.createElement(
      "ul",
      null,
      children
    )
  );
};

export { MyComponent };

export default MyDefaultComponent;

jeeq15:01:04

Module load error

thheller15:01:57

.js files requiring npm components has quite a few edge cases that currently aren't covered well

thheller15:01:22

no time to work on that. it should work if you do import * as React from "react";

jeeq15:01:46

Ah hmmm. It works with that import statement. Thank you. I just thought it was interesting my generated javascript was different from one that you checked in with the example app: Object.defineProperty and _interopRequireDefaults were all missing.

thheller15:01:05

that example is from almost 2 years ago ... stuff has changed since then

thheller15:01:18

in babel and the closure-compiler and shadow-cljs

thheller15:01:05

which configures babel, so it is kinda important

thheller15:01:22

but ... I'm sure all of that has also changed

jeeq15:01:37

Totally understandable 🙂! I’ll try to dig in to see if I can replicate your results with current versions. Thank you so much for your time and effort!

jmckitrick23:01:43

I’m running shadow-cljs release app with version 2.8.69, in an app that works fine in dev mode with hot-reloading, but I’m getting this error:

jmckitrick23:01:45

IllegalArgumentException: No matching field found: getSourceName for class com.google.javascript.jscomp.JSError