Location of Create-React-App app about babel-loader-lerna-cra

[renemn]

Having same issue here. Bootstrapped with create-react-app v2.1.1 through npx on an OSX machine.

loaderToOverride.include = [...config.imports, reactAppSrcDir];
                             ^
TypeError: Cannot set property 'include' of undefined

My loader-lerna-cra looks like this:

  "babel-loader-lerna-cra": {
    "imports": "packages/*-library/src",
    "apps": "packages/*-client"
  }

Hope it helps.

[F1LT3R]

There's a better way... https://github.com/F1LT3R/cra-workspaces-poc

I will try to update the article this week.

[ioss]

Could also be the check for (js|mjs|jsx) in findLoader, as CRA added typescript support, so that string changed.

[ioss]

I think the check should probably be changed to something less strict + it should fail with a warning that no loader was found.

[mihaimariusbaciu]

Hi! I'm having the save issue as @renemn. I encountered it while following the guide in https://github.com/F1LT3R/monorepo-react.

loaderToOverride.include = [...config.imports, reactAppSrcDir];
                             ^
TypeError: Cannot set property 'include' of undefined

For me changing the react-scripts version to 2.0.5 (as it is in the repo) helped fix the problem. Also changing the version to 2.1.1 produced the same error.
Hope it helps to solve the issue.

[F1LT3R]

Hmm... Try playground/src ?

(Ignore this. The apps glob tells where the app directories are, not the src being compiled.)

[F1LT3R]

I'm not sure why you would need the preceding * for the playground dir. And I wonder if the omission of the src/ dir means your playground/**/node_modules/ directory is also getting included. Maybe that could cause problems.

[F1LT3R]

If you have a sample repo, I would be happy to debug it.

[F1LT3R]

Oh... Did you bootstrap before or after moving it? (npx babel-loader-lerna-cra)

[F1LT3R]

I'm trying to recreate your setup, but I'm not sure how you're trying to import the component into the app at playground/.

What import path are you using, in say, playground/src/App.js.

Are you doing something like this? _(I would assume you have to if you're not using Lerna to crosslink resources).

import CompButton from `../../packages/comp-button`

With Lerna you would cross-link your dependencies in packages/ and then include {"dependancies": {"@package": "@version"}} in your app's package.json. This way the imports happen through the node_modules directory.

[mmartinsky]

Hey, thanks for the quick response. I just tried to recreate on my personal PC - I actually didn't get past the final npm start, having run the babel-loader-lerna-cra.

Mike@DESKTOP-711GIQ5 MINGW64 ~/projects/monorepo-react/packages/playground (master)
$ npm start

> [email protected] start C:\Users\Mike\projects\monorepo-react\packages\playground
> react-scripts start

C:\Users\Mike\projects\monorepo-react\node_modules\babel-loader-lerna-cra\override.js:24
    loaderToOverride.include = [...config.imports, reactAppSrcDir];
                             ^

TypeError: Cannot set property 'include' of undefined
    at module.exports (C:\Users\Mike\projects\monorepo-react\node_modules\babel-loader-lerna-cra\override.js:24:30)
    at Object.<anonymous> (C:\Users\Mike\projects\monorepo-react\packages\playground\node_modules\react-scripts\config\webpack.config.dev.js:1:113)
    at Module._compile (module.js:653:30)
    at Object.Module._extensions..js (module.js:664:10)
    at Module.load (module.js:566:32)
    at tryModuleLoad (module.js:506:12)
    at Function.Module._load (module.js:498:3)
    at Module.require (module.js:597:17)
    at require (internal/module.js:11:18)
    at Object.<anonymous> (C:\Users\Mike\projects\monorepo-react\packages\playground\node_modules\react-scripts\scripts\start.js:46:16)
npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! [email protected] start: `react-scripts start`
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the [email protected] start script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.

npm ERR! A complete log of this run can be found in:
npm ERR!     C:\Users\Mike\AppData\Roaming\npm-cache\_logs\2018-10-29T01_31_33_147Z-debug.log

The output from the prior command was fine though:

$ npx babel-loader-lerna-cra
babel-lerna-loader-cra: bootstraping...
babel-lerna-loader-cra: config = { lernaRoot: 'C:\\Users\\Mike\\projects\\monorepo-react',
  settings:
   { imports: 'packages/comp-*/src',
     apps: 'packages/*playground*' },
  apps: [ 'C:/Users/Mike/projects/monorepo-react/packages/playground' ],
  imports:
   [ 'C:/Users/Mike/projects/monorepo-react/packages/comp-button/src' ] }
babel-lerna-loader-cra: copying: packages\playground\node_modules\react-scripts\config/... webpack.config.dev.js => backup.webpack.config.dev.js
babel-lerna-loader-cra: copying: packages\playground\node_modules\react-scripts\config/... webpack.config.replacement.js => webpack.config.dev.js

babel-lerna-loader-cra: copying: packages\playground\node_modules\react-scripts\config/... webpack.config.prod.js => backup.webpack.config.prod.js
babel-lerna-loader-cra: copying: packages\playground\node_modules\react-scripts\config/... webpack.config.replacement.js => webpack.config.prod.js

I'm on Windows, which could be something file system related.

https://github.com/mmartinsky/monorepo-react

[F1LT3R]

Yeah this seems windows related. I can take a look on a VM tomorrow.

[F1LT3R]

Sorry I didn't get time to look at this today. I will try to take a look on Wednesday. Busy week here.

[renemn]

@ioss @F1LT3R yup, that seems to be the problem.
This fixed it:

if (!loader.test.toString().includes('(js|mjs|jsx|ts|tsx)')) {
  return false;
}

[renemn]

Didn't notice your comment, makes sense tho.

[bogdansoare]

having the same issue on OS X

[cmcnamara87]

having the same problem on 2.1.1 :(

[F1LT3R]

https://github.com/F1LT3R/cra-workspaces-poc