zoukankan      html  css  js  c++  java
  • Babel 7 安装与配置

    Babel:帮我们把高级的语法(ES6)转为低级的语法
    /*    Babel 7.x版本  安装如下 (cnpm i @babel/cli -D)
                        //Babel 自带了一个内置的 CLI 命令行工具,可通过命令行编译文件以core为基础。
                        "@babel/cli": "^7.8.4",
                        "@babel/core": "^7.9.6",
                
                        //适应JavaScript的一些新特性
                        "@babel/plugin-proposal-class-properties": "^7.8.3",

                        //每个Babel编译后的脚本文件,都以导入的方式使用Babel的帮助函数,
                        //而不是每个文件都复制一份帮助函数的代码。提高代码重用性,缩小编译后的代码体积.
                        "@babel/plugin-transform-runtime": "^7.9.6",

                        //转码:不同的模块这些es运行环境对es6,es7,es8支持不一,有的支持好,有的支持差,为了充分发挥新版es的特性,
                        //我们需要在特定的平台上执行特定的转码规则,说白了就像是按需转码的意思
                        "@babel/preset-env": "^7.9.6",
                        //main.js:webpack默认打包只能处理JS类型的文件 处理不了非JS类型,
                        //这时候就需要第三方loader加载器进行处理,并在webpack配置中书写匹配规则
                        "babel-loader": "^8.1.0",
      .babelrc下配置                  
      {
      "presets": ["@babel/preset-env"],
      "plugins": ["@babel/plugin-transform-runtime","@babel/plugin-proposal-class-properties"]
      
       } 
       webpack配置文件下
        { test: /.js$/, use: 'babel-loader', exclude: /node_modules/ },//配置
          // Babel 来转换高级ES语法

          此时便可在main.js项目的JS入口编写相关ES6面向对象等方法辣 并log出来
    */
  • 相关阅读:
    流程控制之while循环
    流程控制之case语句
    流程控制之if判断
    元字符
    基本数据类型与值操作
    变量
    shell 基础
    node系列---【node连接数据库步骤解析】
    node系列--【 DML语句对数据库的增删改查】
    node系列--【express生成器安装及第三方中间件安装】
  • 原文地址:https://www.cnblogs.com/2Octobering/p/12900415.html
Copyright © 2011-2022 走看看