Configure default entry points
tip
Hydrogen 2.0 is out now. These archival Hydrogen 1.0 docs are provided only to assist developers during their upgrade process. Please migrate as soon as possible.
Hydrogen includes the following default entry points for your app:
- Client entry point:
@shopify/hydrogen/entry-client, which is included inindex.htmland used for hydration purposes - Server entry point:
App.server.jsx
You can configure the default entry points for your app.
Change the client entry point
If you need to change the client entry point, then create a new file such as src/entry-client.jsx with the following code and update the path in index.html:
// src/entry-client.jsx
import renderHydrogen from '@shopify/hydrogen/entry-client';
const ClientWrapper = (props) => props.children;
export default renderHydrogen(ClientWrapper);
<!-- index.html -->
<script type="module" src="/src/entry-client"></script>
Change the server entry point
If you need to change the server entry point, then make the following updates in the package.json file:
- Development: Pass a
HYDROGEN_SERVER_ENTRYenvironment variable to the development command. - Production: Use a
--ssrflag when building your app.
// package.json
"scripts": {
"dev": "HYDROGEN_SERVER_ENTRY=/my/path/MyApp.server vite",
...
"build:server": "vite build --ssr /my/path/MyApp.server",
...
},