Es6 compatible to the browser

  Because some browser versions are released before es6 finalized and released, so for the older version of the browser is not on the characteristics of es6 be compatible for compatibility issues es6, many teams also made the corresponding development, will es6 syntax converted into es5 syntax for the browser can recognize, act as a translator role; the more common tools: babel, jsx, traceur, es6-shim and so on.

 Babel

  In fact, only about babel default to convert various es5 syntax for conversion API is not updated, such as Promise, Object.assign, Array.from these new methods, this time on the need to provide ployfill to simulate such a providing native support of the browser environment; mainly in two ways: babel-runtime and babel-polyfill;

Babel-runtime

  Effect babel-runtime environment is simulated es5 contains various dispersed polyfill module, we can introduce in its own separate module, such as promise: import 'babel-runtime / core-js / promise';

  This does not add method is not implemented in the global environment, but the introduction of the manual each polyfill will be very inefficient, we can use the runtime transform plug-in automatically, then deal with it all;

First using npm installation: 
npm Babel the install-plugin-dev-Transform-Runtime --save 

then increases options babel-loader webpack profile: 
Loader: [ "Babel-Loader"], 
Query: { 
  plugins: [ 
    "transform- Runtime " 
  ], 
  Presets: [ 'ES2015', 'Stage-0'] 
}

 Babel-polufill

  babel-polyfill is for the global environment, it introduced the browser will have the full range of features defined in the specification, once introduced, it will run a babel-polyfill instance; Usage:

1. Installation polyfill-Babel 
NPM-polyfill --save the install Babel 

2. file referenced in the entry: 
Import 'Babel-polyfill'

 

Guess you like

Origin www.cnblogs.com/mufc/p/11504372.html