assets.json file structure

[kriasoft]

assets.json file structure

[joshua1]

the below from a closed issue , has better info than the read me

Just to clarify, what's the difference between react-app and react-app-tools packages:

react-app - CLI tool and templates for scaffolding a new React project (install globally)
react-app-tools - a bunch of build/run configurations (Webpack, PostCSS, Browsersync, HMR etc.)
The react-app-tools is going to be updated more often. If there is a minor version difference such as react-app-tools v0.2.0 vs v0.2.1, it means that there are no any breaking changes or major improvements. All the major version changes are going to be documented, so you could get an idea by looking at the changelog what's actually changed, what benefits you get and whether you need to change any of your React components to comply with the changes.

It's sort of like JSX code that you can use for the most part as it is for the last 2 years, but the underlying React engine that runs your app has undergone lots of great improvements. You just pull the new React version and automatically gain all the benefits it brings to the table without refactoring your JSX code much. Same with react-app-tools, over time it will bring more cool stuff into your project, which hopefully won't force you to refactor any of the source code of your React app.

Pro tip: you can use npm-check-updates npm module for checking if all the dependencies in your project are up to date:

$ npm install -g npm-check-updates@latest
$ ncu           # shows which dependencies are outdated
$ ncu -a        # updates all the dependencies in package.json to the latest versions
$ npm install   # installs outdated/missing npm packages based on package.json

[koistya]

The ./assets.json is an auto-generated file (by Webpack), which looks something like this:

{
  "main": [
    "/static/js/main.38acea01.js"
  ],
  "home": [
    "/static/js/home.8f96c2d4.chunk.js"
  ],
  "news": [
    "/static/js/news.33c2f47a.chunk.js"
  ]
}

It's supposed to be used for referencing JavaScript bundles on the page. Take a look at this online demo: https://firebase.reactstarter.com - right-click > view source. You will see the list of JavaScript chunks. Now open https://firebase.reactstarter.com/news -> right-click > view source > you will see a different set of chunks. This way you can optimize the initial page load time.