lifeart / ember-cli-fallback-builds

Modern/Legacy browsers support, having different js files
MIT License
23 stars 1 forks source link
ember-addon ember-cli emberjs modern-browsers

ember-cli-fallback-builds

Greenkeeper badge

This addon allow to have 2 builds (bundles) (for modern and legacy browsers) in one time.

(module, nomodule)

Modern Script Loading

Pre-RFC: Generate and serve ES2015 assets

Alternatives:

Compatibility

Installation

ember install ember-cli-fallback-builds

Usage

Configure your config/targets.js:

process.env.BUILD_TARGET = LEGACY | MODERN

Example:

config/targets.js

const browsers = [
  'last 1 Chrome versions'
];

const isFallback = process.env.BUILD_TARGET === 'LEGACY';

if (isFallback) {
  browsers.push('ie 11');
}

module.exports = {
  browsers
};

run:

ember build:fallback --prod

check index.html

dist/index.html before:

<body>
    <script src="https://github.com/lifeart/ember-cli-fallback-builds/raw/master/assets/vendor.js"></script>
    <script src="https://github.com/lifeart/ember-cli-fallback-builds/raw/master/assets/dummy.js"></script>
</body>

after:

<body>
    <script src="https://github.com/lifeart/ember-cli-fallback-builds/raw/master/assets/vendor.js" type="module"></script>
    <script src="https://github.com/lifeart/ember-cli-fallback-builds/raw/master/assets/dummy.js" type="module"></script>

    <script src="https://github.com/lifeart/ember-cli-fallback-builds/raw/master/assets/vendor.fb.js" nomodule></script>
    <script src="https://github.com/lifeart/ember-cli-fallback-builds/raw/master/assets/dummy.fb.js" nomodule></script>
</body>

new files: vendor.fb.js, dummy.fb.js - legacy js bundles (for older browsers)

modern browser will load script[type="module"], older - script[nomodule]

done!

Contributing

See the Contributing guide for details.

License

This project is licensed under the MIT License.