Razzle: How to apply razzle to existing project?

I am going through this now myself.
I had CRA project setup in the following way:

/projects/my-cra-app
underneath the above, I then, have src , node_modules and everythign else that CRA created.

I could not figure out a way to mix razzle into it (and at first, I thought that razzle would replace CRA, and could actually serve Client-render(port 3001) and Server-render (port 3000) from the same project. But that did not work either (I posted a question on that earlier, here, but no responses).
Also I am using razzle latest (alpha) with webpack4, while CRA is still webpack (3) although some intial commits for webpack 4 now landed on their master branch...

So what I did for now, was the following

/projects/my-app/app.src
/projects/my-app/app-cra that contains node_modules (with ./src/ containing cra-generated App.js App.css)
/projects/my-app/app-ssr that contains node_modules (with ./src/ containing razzle-generated stuff)

then app-cra/src also contains a symlink to ../../app.src
and app-ssr/src also contains a symlink to ../../app.src

this way I can share same source but different entry point scripts, and different node_modules between razzle and cra.

unfortunately razzle will not transply/compile your JS right from the symlinked directories (neither will cRA for that matter).

So I am using rewire for CRA, and razle-config.js to instruct both to look at my JS files in the symlinked directories.

if you want to take a pick at razle-config.js that I have now, you can see it here on stack-overflow (as I am running into a problem with one of the libraries that I am trying to use for SSR... so searching for help on stack-overflow for that ).

It is bit complicated because I am doing more than default razzle (react-native-web, react-vector-icons, sass, symlinked directories..., transplying some selected node_modules modules, because their authors chose not to deliver them for web-deployments, etc. )

https://stackoverflow.com/questions/50514135/error-in-react-native-vector-icons-when-using-for-web-server-side-rendering

Hmm, thank you for your answer. Still don't get how to make it tho

@ifndefdeadmau5 keep your CRA app.

a) create another new app with create-razzle-app, at the same folder level at your CRA app.

b) move the files that you want to share between the 2 apps, into a common folder.

c) Create symbolic links from the the src directory of the two apps, pointing into the folder your created in b).

d) use razzle-config.js and rewire (for CRA app) to instruct the webpack to transply the the JS files in the symlinks created in step c).

I could not figure out another way of doing yes, so others might have better answers...

@jaredpalmer Hello, could you provide a solution on how to migrate from CRA to razzle server rendering app and update the related doc in readme? Thanks in advance.

Hola! So here's the deal, between open source and my day job and life and what not, I have a lot to manage, so I use a GitHub bot to automate a few things here and there. This particular GitHub bot is going to mark this as stale because it has not had recent activity for a while. It will be closed if no further activity occurs in a few days. Do not take this personally--seriously--this is a completely automated action. If this is a mistake, just make a comment, DM me, send a carrier pidgeon, or a smoke signal.

ProBot automatically closed this due to inactivity. Holler if this is a mistake, and we'll re-open it.

I am having same question. I have created a custom React App. How can I integrate razzle into it?

Any update on this?

I have the same question there should be some tutorials on this.

any progress with it?

I'm also having issues with this. I had a perfectly working CRA app and tried to migrate to Razzle by renaming index.tsx to client.tsx and adding a server to index.ts, however when I run razzle start it seems like it tries to bundle server code with the client and throws errors like

These dependencies were not found:

* fs in ../.yarn/$$virtual/babel-plugin-styled-components-virtual-cfb9253662/0/cache/babel-plugin-styled-components-npm-1.11.1-9e78975a1c-4b545bed54.zip/node_modules/babel-plugin-styled-components/lib/visitors/displayNameAndId.js, ../.yarn/cache/cosmiconfig-npm-6.0.0-cb7d64a2b9-bbd6bbaefe.zip/node_modules/cosmiconfig/dist/readFile.js and 4 others
* module in ../.yarn/cache/resolve-patch-af4189aea7-9e62d2803a.zip/node_modules/resolve/lib/normalize-options.js, ../.yarn/cache/resolve-from-npm-4.0.0-f758ec21bf-87a4357c0c.zip/node_modules/resolve-from/index.js

Anyone had the same or has any idea how to fix this?