index.[tj]s

WARNING

Soon to be deprecated, it is recommended to use entry.[tj]s

The identifier for the entry point when the application uses custom bootstrap.

In general, the App.[tj]sx hook file can already meet our needs. When we need to add custom behavior before bootstrap or completely take over the webpack packaging entry, we can place index.[tj]s in the src or entry directory. There are two cases below:

Add custom behavior before bootstrap

Just export a function in src/index.[tj]s:

src/index.js
import { bootstrap } from '@modern-js/runtime';

export default App => {
  // do something before bootstrap...
  bootstrap(App, 'root');
};

Completely take over the webpack entry

When there is no default export function in src/index.[tj]sx?, the file is the real webpack packaging entry file and the code can be organized directly as using create-react-app and other scaffolding tools:

src/index.jsx
import React from 'react';
import ReactDOM from 'react-dom';
import App from './App';

ReactDOM.render(<App />, document.getElementById('root'));