🔧 Hydrogen Config+v0.5.6

You can pass a config file to the Hydrogen CLI, the config file is accessible to the Layout, Page, Data and Head API

Create a file called hydrogen.config.js in the root of your project

Set a global project name

The name property can be used as the root title of all your pages

hydrogen.config.js 
    
      module.exports = {
        name: 'Hydrogen WebApp',
      };

Now we can access the config via the config object

layouts/default.js 
    
      module.exports = ({ config }) => `
        <title>${config.name}</title>
      `;

Set a static assets folder

We need some way of copying our static assets into the dist folder, you can now set a static assets folder via staticFolder property.

Your static assets folder must be in the root of the project

hydrogen.config.js 
    
      module.exports = {
        name: 'Hydrogen Webapp',
        staticFolder: 'public'
      };

Copy extra static files +v0.5.11

You now able to copy static files like manifest.json or any root-level files in your project to the dist folder

hydrogen.config.js 
    
      module.exports = {
        name: 'Hydrogen Webapp',
        staticFolder: 'public'
        extraStaticFiles: [
          'robots.txt',
          'manifest.json',
          'sitemap.xml',  
        ]
      };

Set global head tags

You now have access to the Head API in the config for global meta info

The global head tags are merged with the head tags in each page

    
      module.exports = {
        name: 'Hydrogen Webapp',
        staticFolder: 'public',
        head: ({ config }) => [
          ['script', { src: 'https://my.script.js' }, true],
          ['link', { rel: 'stylesheet', href: `/${config.staticFolder}/css/main.css` }],
          ['meta', { property: 'og:site_name', content: config.name }],
        ],
      };

Setting a custom Service Worker +v0.6

Want to add a Service Worker to your application, you can now do that with the sw property. Your Service Worker will have access to all the routes generated by Hydrogen. Find out more: 🩺 Setting Up a Service Worker

You still need to manually include the registration script for your Service Worker. You can do that in a layout

    
      module.exports = {
        name: 'Hydrogen Webapp',
        sw: 'service_worker.js',
      };

Delete dist folder before build +v0.8

Hydrogen will automatically delete the dist folder before each build by default. You can turn this off by setting build.deleteFolder to false 

    
      module.exports = {
        build: {
          deleteFolder: false,
        },
      };