search

scottcharlesworth / laravel-mix-polyfill

A Laravel Mix extension to include polyfills by using Babel, core-js, and regenerator-runtime
MIT License
50 stars 7 forks source link

readme

NPM NPM NPM

Laravel Mix Polyfill

A Laravel Mix extension to include polyfills by using Babel, core-js, and regenerator-runtime.

Usage

First, install the extension.

npm install laravel-mix-polyfill --save-dev

or

yarn add laravel-mix-polyfill --dev

Then, require it within your webpack.mix.js file:

let mix = require('laravel-mix');

require('laravel-mix-polyfill');

mix.js('resources/js/app.js', 'public/js')
   .sass('resources/sass/app.scss', 'public/css')
   .polyfill({
      enabled: true,
      useBuiltIns: "usage",
      targets: "firefox 50, IE 11"
   });

Options

Name Type Default Description
enabled boolean true Should polyfill be used.
useBuiltIns string "usage" See here for detailed description. Possible values are:
• "usage"
• "entry"
• false
targets string, boolean "defaults" Allows a target (browser) environment to be specified. This can either be:
• a browserslist-compatible query ("> 0.25%, not dead"),
• or false to transform all ECMAScript 2015+ code by default.

• Setting to false will also allow use of browserslist config sources (like .browserslistrc). See here and here for more information.

You can test string values on browserl.ist.
entryPoints string, boolean "stable" Used when useBuiltIns is set to "entry". See below for possible values.
corejs number 3 The version of core-js to be used.
debug boolean false Outputs the targets/plugins used to the console.

Entry Points

In core-js@3 the entry points were changed to allow for more flexibility.

The following common presets have been included for ease, and will be inserted into the entry point for you automatically. "stable" has been set as the default as it is a full equal of the now deprecated @babel/polyfill package which was used previously.

Value Description
"stable" Polyfill only stable core-js features - ES and web standards.
"all" Polyfill all core-js features.
"es" Polyfill only stable ES features.
"classic" Imports copied from the latest @babel/polyfill package (before it was deprecated).
false Do not use a preset (you will need to add your own imports to the top of your entry point).