• webpack es6支持配置


    1. Install Babel and the presets:

       npm install --save-dev babel-core babel-preset-es2015
    2. Install babel-loader:

       npm install --save-dev babel-loader
    3. Configure Babel to use these presets by adding .babelrc

       { "presets": [ "es2015" ] }
    4. Modify webpack.config.js to process all .js files using babel-loader.

       module.exports = {
           entry: './src/app.js',
           output: {
               path: './bin',
               filename: 'app.bundle.js',
           },
           module: {
               loaders: [{
                   test: /.js$/,
                   exclude: /node_modules/,
                   loader: 'babel-loader',
               }]
           }
       }

      We are excluding node_modules here because otherwise all external libraries will also go through Babel, slowing down compilation.

    5. Install the libraries you want to use (in this example, jQuery):

       npm install --save jquery babel-polyfill

      We are using --save instead of --save-dev this time, as these libraries will be used in runtime. We also usebabel-polyfill so that ES2015 APIs are available in older browsers.

    6. Edit src/app.js:

       import 'babel-polyfill';
       import cats from './cats';
       import $ from 'jquery';
      
       $('<h1>Cats</h1>').appendTo('body');
       const ul = $('<ul></ul>').appendTo('body');
       for (const cat of cats) {
           $('<li></li>').text(cat).appendTo(ul);
       }
    7. Bundle the modules using webpack:

       webpack
    8. Add index.html so this app can be run:

       <!DOCTYPE html><body>
       <script src="bin/app.bundle.js"></script>
  • 相关阅读:
    hrbust 1788
    poj2299 ( bit )
    LA3027(并查集)
    hdu1166 (bit)
    hdu1598(并查集)
    cdoj1215 (并查集)
    hdu2643 ( 第二类斯特灵数 )
    hdu3625 ( 第一类斯特灵数 )
    Uva10066
    怎么处理sqlserver2017部署在winowsDocker上时区无法修改成功的方式,并且可以多创建新的容器调用简单的方式直接使用!
  • 原文地址:https://www.cnblogs.com/rongfengliang/p/5585674.html
Copyright © 2020-2023  润新知