Skip to content

Hacking create-react-app to work with Preact & LESS without ejecting

License

Notifications You must be signed in to change notification settings

sampi/create-react-app-hack

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

12 Commits
 
 
 
 
 
 
 
 

Repository files navigation

create-react-app-hack

Hacking create-react-app to work with Preact & LESS without ejecting

Why?

  • Preact is better at living together with external libraries and Custom Elements than React,
  • Preact is smaller, even when adding preact-compat (React vs Preact),
  • Preact's codebase is small enough to read in a single sitting,
  • Preact didn't have license issues,
  • We didn't want to eject and lose getting updates to react-scripts,
  • We didn't want to change to another bootstrap framework or write our own,
  • My cat told me to do it.

How?

I broke the hack down to 5 steps and you can view them as Pull Requests here in this repo:

Step 0 - Initialize using create-react-app

#1

We bootstrap our repo with create-react-app

Step 1 — Switch from react to preact

#2

This is the hack itself, we trick create-react-app into using preact by aliasing all the related modules.

Step 2 — Set babel’s IE target from 9 to 11

#3

We don't need to support IE9 or IE10, let's not build for them either!

Step 3 — Add LESS compilation

#4

Time to pre-process LESS into CSS.

Step 4 — Add webpack-subresource-integrity

#5

This is how you can add extra webpack plugins.

Look at Gustav, my cat!

This is Gustav!

PS: My team working on Tradeshift UI Components is hiring!

Releases

No releases published

Packages

No packages published