CSS & JavaScript

How to handle assets for use in a web browser

Browser assets are stored in two distinct folders, based on whether these assets require processing or not.

Static Assets

Any assets that do not require processing (e.g., fonts, robots.txt, icons) should be placed in the /public directory. They will be served as static files from the root directory.

Route path URL
public/robots.txt /robots.txt
public/fonts/ubuntu.woff2 /fonts/ubuntu.woff2

CSS & JavaScript

CSS, JavaScript, or TypeScript files that require processing and minification should be stored in the src/browser directory and must be named as index.[css|js|jsx|ts|tsx] . Only index files serve as bundle entries and are accessible to the client. This approach offers flexibility in creating a custom directory layout.

Route path URL
browser/src/index.css /index.css
browser/src/custom/index.js /custom/index.js
browser/src/utils/date.js This file will be not available via an url.

Shared code

While you have the flexibility to share code between the server and browser, this is typically an edge case, as the DOM is not relevant on the server side, and node core modules are not compatible with the browser. To optimize build performance during development by efficiently minimizing unnecessary rebuilds, no rebuild is triggered when shared code changes per default. You can easily configure additional paths which should be watched for building the browser bundles via an environment variable: JEASX_BUILD_JS_WATCH="src/browser,src/shared"