Old Browsers support

Start with Fluid Design System for old browsers like IE 11

If you need to get your application working with other browsers than main targeted by Engie Fluid design system, we provide a different library build.
We let you decide when to include the standard library or the Old Browsers Support library, depending on your need. We don’t provide detection.

Browserslist:

  • > 0.25%
  • not dead

Update or install

Update your minimum fluid-design-system package to version 4.

npm update @engie-group/fluid-design-system@4.0.2

Install the package inside your application from npmjs:

npm install @engie-group/fluid-design-system

Import library in your application code

Make sure to exclude fluid-design-system-obs.js from your webpack babel JS loader.

...
 module: {
      rules: [
        {
          test: /\.js$/,
          exclude: /(node_modules|fluid-design-system-obs.js)/,
          use: [
            {
              loader: 'babel-loader',
              options: {
                presets: ['@babel/preset-env']
              }
            }
          ]
        }
 ...
import '@engie-group/fluid-design-system/lib/fluid-design-system-obs.js'

Import using script tag

<html>
  <body>
    ...
    <script src="/your-js-path/fluid-design-system-obs.js"></script>
    <script>...</script>
  </body>
</html>

Use Old Browsers library the same as you use standard library.

Troubleshooting

If you have any issues while getting set up with Fluid Design System, please create an issue or a request on our library git repository.