Fork me on GitHub
#cljsrn
<
2022-11-09
>
joshmiller17:11:58

My RN+Krell template has been updated, and should now give you the latest RN version (0.70.5) when initializing a new project: https://github.com/joshuamiller/react-native-template-cljs-krell-storybook

🎉 6
👏 2
1
Will Weiss06:11:14

Thanks @U0E1JV8GK for this work! I'm trying to get this project set up and am running into an issue with bundler. I'm seeing that the version of bundler is older than the version that created the lock file. When I subsequently run ruby -v and gem update bundler it looks like I have the correct versions. Any idea what might be going on? Thanks in advance!

$ npx react-native init cljkrelltest --template react-native-template-cljs-krell-storybook           

                  Welcome to React Native!                
                 Learn once, write anywhere               

✔ Downloading template
✔ Copying template
✔ Processing template
ℹ Executing post init script 
✖ Installing Bundler
error Warning: the running version of Bundler (2.1.4) is older than the version that created the lockfile (2.2.27). We suggest you to upgrade to the version that created the lockfile by running `gem install bundler:2.2.27`.
Your Ruby version is 2.7.5, but your Gemfile specified 2.7.4

✖ Installing Bundler
error Error: Looks like your iOS environment is not properly set. Please go to  and follow the React Native CLI QuickStart guide for macOS and iOS.
┌[willweiss@isengard]-(~/dev)
└> gem update bundler
Updating installed gems
Nothing to update
Gems already up-to-date: bundler
┌[willweiss@isengard]-(~/dev)
└> ruby -v
ruby 2.7.4p191 (2021-07-07 revision a21a3b7d23) [arm64-darwin22]

joshmiller15:11:15

@U04A2EM0XHC I wonder if deleting Podfile.lock and then reinstalling would fix this? If so, I can make that fix on the repo as well.

Will Weiss16:11:12

Thanks for helping out Josh! I'm looking at the project and don't see a Podfile.lock file. I also have flutter installed which appears to have Podfile.lock files stored elsewhere

/opt/homebrew/Caskroom/flutter/3.3.4/flutter/dev/integration_tests/flutter_gallery/macos/Podfile.lock
/opt/homebrew/Caskroom/flutter/3.3.4/flutter/examples/platform_view/ios/Podfile.lock

joshmiller16:11:53

Hm, that’s weird, because the error message about the older version of Bundler would refer to a previous version of Podfile.lock, so I sssumed it was in there.

Will Weiss16:11:19

Hm, strange...

joshmiller16:11:01

Did you try gem install bundler:2.2.27

Will Weiss16:11:29

gem install bundler:2.2.7
Fetching bundler-2.2.7.gem
Successfully installed bundler-2.2.7
Parsing documentation for bundler-2.2.7
Installing ri documentation for bundler-2.2.7
Done installing documentation for bundler after 1 seconds
1 gem installed

joshmiller16:11:50

Sorry, 27, typo on my part

Will Weiss16:11:07

no worries!

$ gem install bundler:2.2.27
Fetching bundler-2.2.27.gem
Successfully installed bundler-2.2.27
Parsing documentation for bundler-2.2.27
Installing ri documentation for bundler-2.2.27
Done installing documentation for bundler after 1 seconds
1 gem installed

joshmiller16:11:30

Maybe try a clean new install from the template now that you have that exact version?

Will Weiss16:11:42

Ok! trying now...

Will Weiss16:11:50

Ok! That appeared to fix the bundler version issue, but not the ruby version issue. I have rbenv installed and my global ruby version set to 2.7.4 — so I'm not sure what's going on.

$ npx react-native init cljkrelltest --template react-native-template-cljs-krell-storybook

                  Welcome to React Native!                
                 Learn once, write anywhere               

✔ Downloading template
✔ Copying template
✔ Processing template
ℹ Executing post init script 
✖ Installing Bundler
error Your Ruby version is 2.7.5, but your Gemfile specified 2.7.4

✖ Installing Bundler
error Error: Looks like your iOS environment is not properly set. Please go to  and follow the React Native CLI QuickStart guide for macOS and iOS.
┌[willweiss@isengard]-(~/dev)
└> ruby -v
ruby 2.7.4p191 (2021-07-07 revision a21a3b7d23) [arm64-darwin22]

joshmiller16:11:36

Hm, maybe remove the .ruby-version?

Will Weiss16:11:32

$ cd cljkrelltest/
Version 'nvm' not found - try `nvm ls-remote` to browse available versions.
┌[willweiss@isengard]-(~/d/cljkrelltest)
└> ls -la
total 1352
drwxr-xr-x    31 willweiss  staff     992 Nov 10 10:10 ./
drwxr-xr-x    40 willweiss  staff    1280 Nov 10 10:09 ../
-rw-r--r--     1 willweiss  staff     114 Nov 10 10:09 .buckconfig
drwxr-xr-x     3 willweiss  staff      96 Nov 10 10:09 .bundle/
-rw-r--r--     1 willweiss  staff      74 Nov 10 10:09 .eslintrc.js
-rw-r--r--     1 willweiss  staff    1451 Nov 10 10:09 .flowconfig
-rw-r--r--     1 willweiss  staff     844 Nov 10 10:09 .gitignore
-rw-r--r--     1 willweiss  staff       3 Nov 10 10:09 .node-version
-rw-r--r--     1 willweiss  staff      16 Nov 10 10:09 .nvmrc
-rw-r--r--     1 willweiss  staff     141 Nov 10 10:09 .prettierrc.js
-rw-r--r--     1 willweiss  staff       6 Nov 10 10:09 .ruby-version
drwxr-xr-x     3 willweiss  staff      96 Nov 10 10:09 .storybook/
-rw-r--r--     1 willweiss  staff       2 Nov 10 10:09 .watchmanconfig
-rw-r--r--     1 willweiss  staff    2465 Nov 10 10:09 App.js
-rw-r--r--     1 willweiss  staff     168 Nov 10 10:09 Gemfile
-rw-r--r--     1 willweiss  staff    2414 Nov 10 10:09 Gemfile.lock
drwxr-xr-x     3 willweiss  staff      96 Nov 10 10:09 __tests__/
drwxr-xr-x     9 willweiss  staff     288 Nov 10 10:09 android/
-rw-r--r--     1 willweiss  staff      61 Nov 10 10:09 app.json
-rw-r--r--     1 willweiss  staff      77 Nov 10 10:09 babel.config.js
-rw-r--r--     1 willweiss  staff      80 Nov 10 10:10 build.edn
-rw-r--r--     1 willweiss  staff     164 Nov 10 10:09 deps.edn
-rw-r--r--     1 willweiss  staff    1631 Nov 10 10:09 index.js
drwxr-xr-x     6 willweiss  staff     192 Nov 10 10:09 ios/
drwxr-xr-x     4 willweiss  staff     128 Nov 10 10:09 js/
-rw-r--r--     1 willweiss  staff     299 Nov 10 10:09 metro.config.js
drwxr-xr-x  1101 willweiss  staff   35232 Nov 10 10:10 node_modules/
-rw-r--r--     1 willweiss  staff    1466 Nov 10 10:10 package.json
-rw-r--r--     1 willweiss  staff    1210 Nov 10 10:09 post_install.cljs
drwxr-xr-x     3 willweiss  staff      96 Nov 10 10:10 src/
-rw-r--r--     1 willweiss  staff  607433 Nov 10 10:10 yarn.lock
┌[willweiss@isengard]-(~/d/cljkrelltest)
└> rm .ruby-version 

Will Weiss16:11:59

How do I then restart the install process (not from scratch via npx react-native init cljkrelltest --template react-native-template-cljs-krell-storybook)

joshmiller16:11:38

I don’t think there’s any functionality to do that unfortunately, it just points you at the quick start guide.

joshmiller16:11:51

I think there also might be a conflict between .node-version (I think new in this RN version) and .nvmrc.

joshmiller16:11:10

I’m going to be afk for a while, but I can look into these later today.

Will Weiss16:11:23

Ok, thanks for your help Josh!

Will Weiss17:11:47

I noticed that the version numbers in the Gemfile and ruby_version don't match, so here's a PR to fix that: https://github.com/joshuamiller/react-native-template-cljs-krell-storybook/pull/4

joshmiller02:11:18

@U04A2EM0XHC Awesome, thanks for finding that. I ended up going the opposite direction and updating the Gemfile instead (as I should have done when upgrading RN).

👍 1
joshmiller02:11:39

Did you end up getting everything going after making that change? Or still having issues with Node?

Will Weiss14:11:18

Thanks for that fix! I got further this time, and then ran into this issue when running npx react-native run-ios

info Reloading app...
 BUNDLE  ./index.js 

error: Error: Unable to resolve module ./target/main.js from /Users/willweiss/dev/cljkrelltest/index.js: 

None of these files exist:
  * target/main.js(.native|.ios.js|.native.js|.js|.ios.jsx|.native.jsx|.jsx|.ios.json|.native.json|.json|.ios.ts|.native.ts|.ts|.ios.tsx|.native.tsx|.tsx)
  * target/main.js/index(.native|.ios.js|.native.js|.js|.ios.jsx|.native.jsx|.jsx|.ios.json|.native.json|.json|.ios.ts|.native.ts|.ts|.ios.tsx|.native.tsx|.tsx)
   8 | } from 'react-native';
   9 | import {name as appName} from './app.json';
> 10 | import {krellUpdateRoot, onKrellReload} from './target/main.js';
     |                                               ^
  11 |
  12 | let plainStyle = {
  13 |     flex: 1,
    at ModuleResolver.resolveDependency (/Users/willweiss/dev/cljkrelltest/node_modules/metro/src/node-haste/DependencyGraph/ModuleResolution.js:152:15)
    at DependencyGraph.resolveDependency (/Users/willweiss/dev/cljkrelltest/node_modules/metro/src/node-haste/DependencyGraph.js:264:43)
    at Object.resolve (/Users/willweiss/dev/cljkrelltest/node_modules/metro/src/lib/transformHelpers.js:170:21)
    at resolveDependencies (/Users/willweiss/dev/cljkrelltest/node_modules/metro/src/DeltaBundler/graphOperations.js:466:33)
    at processModule (/Users/willweiss/dev/cljkrelltest/node_modules/metro/src/DeltaBundler/graphOperations.js:232:31)
    at async traverseDependenciesForSingleFile (/Users/willweiss/dev/cljkrelltest/node_modules/metro/src/DeltaBundler/graphOperations.js:221:3)
    at async Promise.all (index 0)
    at async initialTraverseDependencies (/Users/willweiss/dev/cljkrelltest/node_modules/metro/src/DeltaBundler/graphOperations.js:204:3)
    at async DeltaCalculator._getChangedDependencies (/Users/willweiss/dev/cljkrelltest/node_modules/metro/src/DeltaBundler/DeltaCalculator.js:208:25)
    at async DeltaCalculator.getDelta (/Users/willweiss/dev/cljkrelltest/node_modules/metro/src/DeltaBundler/DeltaCalculator.js:90:16)

joshmiller22:11:03

This is because you haven’t built the CLJS yet. yarn cljs:build should do that for you. yarn cljs:repl will do it and leave a repl connection open.

👍 1
tifa08:11:43

@U0E1JV8GK Is it possible to write stories(and components) for a Storybook in ClojureScript using your RN+Krell template?

joshmiller15:11:20

I am sure it is possible, but I have not tried to do it. The stories are so minimal it doesn’t seem worth the effort.