{"id":19069597,"url":"https://github.com/srect/webpack4-babel7","last_synced_at":"2026-05-17T04:30:17.041Z","repository":{"id":39526140,"uuid":"189949666","full_name":"sRect/webpack4-babel7","owner":"sRect","description":"babel7练习","archived":false,"fork":false,"pushed_at":"2023-01-03T23:18:42.000Z","size":12182,"stargazers_count":1,"open_issues_count":29,"forks_count":1,"subscribers_count":1,"default_branch":"master","last_synced_at":"2025-01-02T15:45:25.125Z","etag":null,"topics":["babel7","webpack4"],"latest_commit_sha":null,"homepage":null,"language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/sRect.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2019-06-03T06:44:28.000Z","updated_at":"2020-12-03T09:24:41.000Z","dependencies_parsed_at":"2023-02-01T13:16:41.386Z","dependency_job_id":null,"html_url":"https://github.com/sRect/webpack4-babel7","commit_stats":null,"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/sRect%2Fwebpack4-babel7","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/sRect%2Fwebpack4-babel7/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/sRect%2Fwebpack4-babel7/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/sRect%2Fwebpack4-babel7/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/sRect","download_url":"https://codeload.github.com/sRect/webpack4-babel7/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":240122573,"owners_count":19751142,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["babel7","webpack4"],"created_at":"2024-11-09T01:14:51.860Z","updated_at":"2026-05-17T04:30:16.984Z","avatar_url":"https://github.com/sRect.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"## 练习babel\n\u003e 参考文章\n1. [Babel快速上手使用指南](https://juejin.im/post/5cf45f9f5188254032204df1?utm_source=gold_browser_extension#comment)\n2. [babel 7 教程](https://blog.zfanw.com/babel-js/#babel-%E5%A5%97%E9%A4%90)\n3. [Show me the code，babel 7 最佳实践！](https://juejin.im/post/5c03a4d0f265da615e053612#heading-5)\n4. [Configure Babel](https://babeljs.io/docs/en/configuration)\n\n使用\n```bash\ngit clone\nnpm install\nnpm run start\n// 或者直接通过babel编译 \nnpm run babel_build\n```\n\n.babelrc配置\n```json\n{\n  \"presets\": [\n    [\"@babel/preset-env\", {\n      \"modules\": false, // 模块使用 es modules ，不使用 commonJS 规范\n      \"useBuiltIns\": \"usage\", // usage-按需引入 entry-入口引入（整体引入） false-不引入polyfill\n      \"corejs\": 2,\n      \"targets\": {\n        \"browsers\": [\n          \"last 2 version\",\n          \"\u003e 0.5%\",\n          \"IE 10\",\n          \"not dead\"\n        ],\n      }\n    }]\n  ],\n  \"plugins\": [\n    [\"@babel/plugin-transform-runtime\", {\n      \"corejs\": 2,\n      \"helpers\": true, // 默认\n      \"regenerator\": false, // 通过 preset-env 已经使用了全局的 regeneratorRuntime, 不再需要 transform-runtime 提供的 不污染全局的 regeneratorRuntime\n      \"useESModules\": true // 使用 es modules helpers, 减少 commonJS 语法代码\n    }]\n  ]  \n}\n```\n\n源代码\n```javascript\nclass IteratorTest {\n  constructor(arr) {\n    this.arr = arr || [];\n  }\n\n  createIterator() {\n    return new Promise((resolve, reject) =\u003e {\n      let iterator = this.arr[Symbol.iterator]();\n\n      if (iterator) {\n        resolve(iterator)\n      } else {\n        reject('ERROR');\n      }\n      \n    })\n  }\n\n  async foo() {\n    let [error, iterator] = await this.createIterator().then(data =\u003e [null, data]).catch(error =\u003e [error, null]);\n\n    if (iterator) {\n      console.log(iterator.next());\n      console.log(iterator.next());\n      console.log(iterator.next());\n      console.log(iterator.next());\n    }\n  }\n}\n\nconst iteratorTest = new IteratorTest([1,2,3]);\niteratorTest.foo();\n```\n\nbabel编译后的代码\n```javascript\nimport _slicedToArray from \"@babel/runtime-corejs2/helpers/esm/slicedToArray\";\nimport \"regenerator-runtime/runtime\";\nimport _asyncToGenerator from \"@babel/runtime-corejs2/helpers/esm/asyncToGenerator\";\nimport _getIterator from \"@babel/runtime-corejs2/core-js/get-iterator\";\nimport _Promise from \"@babel/runtime-corejs2/core-js/promise\";\nimport _classCallCheck from \"@babel/runtime-corejs2/helpers/esm/classCallCheck\";\nimport _createClass from \"@babel/runtime-corejs2/helpers/esm/createClass\";\n\nvar IteratorTest =\n/*#__PURE__*/\nfunction () {\n  function IteratorTest(arr) {\n    _classCallCheck(this, IteratorTest);\n\n    this.arr = arr || [];\n  }\n\n  _createClass(IteratorTest, [{\n    key: \"createIterator\",\n    value: function createIterator() {\n      var _this = this;\n\n      return new _Promise(function (resolve, reject) {\n        var iterator = _getIterator(_this.arr);\n\n        if (iterator) {\n          resolve(iterator);\n        } else {\n          reject('ERROR');\n        }\n      });\n    }\n  }, {\n    key: \"foo\",\n    value: function () {\n      var _foo = _asyncToGenerator(\n      /*#__PURE__*/\n      regeneratorRuntime.mark(function _callee() {\n        var _ref, _ref2, error, iterator;\n\n        return regeneratorRuntime.wrap(function _callee$(_context) {\n          while (1) {\n            switch (_context.prev = _context.next) {\n              case 0:\n                _context.next = 2;\n                return this.createIterator().then(function (data) {\n                  return [null, data];\n                }).catch(function (error) {\n                  return [error, null];\n                });\n\n              case 2:\n                _ref = _context.sent;\n                _ref2 = _slicedToArray(_ref, 2);\n                error = _ref2[0];\n                iterator = _ref2[1];\n\n                if (iterator) {\n                  console.log(iterator.next());\n                  console.log(iterator.next());\n                  console.log(iterator.next());\n                  console.log(iterator.next());\n                }\n\n              case 7:\n              case \"end\":\n                return _context.stop();\n            }\n          }\n        }, _callee, this);\n      }));\n\n      function foo() {\n        return _foo.apply(this, arguments);\n      }\n\n      return foo;\n    }()\n  }]);\n\n  return IteratorTest;\n}();\n\nvar iteratorTest = new IteratorTest([1, 2, 3]);\niteratorTest.foo();\n```","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fsrect%2Fwebpack4-babel7","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fsrect%2Fwebpack4-babel7","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fsrect%2Fwebpack4-babel7/lists"}