Babel 7 - 节点静态 class 方法未定义

Question

我正在尝试使用 babel 7 编译一个简单的 ES6 模块（库），里面有一个静态函数。

// src/index.js
class YtUrl {
    static extractIdFromUrl(url) {
        const regExp = /^.*(?:(?:youtu\.be\/|v\/|vi\/|u\/\w\/|embed\/)|(?:(?:watch)?\?v(?:i)?=|\&v(?:i)?=))([^#\&\?]*).*/
        const [, videoID] = url.match(regExp)
        return videoID
    }
}

将编译好的模块导入js节点文件进行测试

const YtUrl = require('./dist/index')
console.log(YtUrl).                 // { default: [Function: YtUrl] }
console.log(YtUrl.extractIdFromUrl) // undefined
// usage: YtUrl.extractIdFromUrl('https://wwww.youtube.com/....')

但是 static 方法 未定义 。以下是我的package.json

"scripts": {
  "build": "rm -rf dist && babel src --out-dir dist",
  "test": "echo \"Error: no test specified\" && exit 1"
},
"devDependencies": {
  "@babel/cli": "^7.11.6",
  "@babel/core": "^7.11.6",
  "@babel/plugin-proposal-class-properties": "^7.10.4",
  "@babel/preset-env": "^7.11.5"
}

这里是 .babelrc 文件

{
  "presets": [
    [
      "@babel/preset-env",
      {
        "useBuiltIns": "usage",
        "corejs": "3"
      }
    ]
  ],
  "plugins": ["@babel/plugin-proposal-class-properties"]
}

Answer 1

存在静态方法，但您正在访问错误的值。

console.log(YtUrl)表明YtUrl的值是一个带有default属性的对象，不是函数：

{ default: [Function: YtUrl] }

这意味着 class 在 YtUrl.default:

可用

console.log(YtUrl.default.extractIdFromUrl)

在 CommonJS 上下文中使用 ES 模块时，默认导出通常在模块对象的 default 属性处可用。

Babel 7 - 节点静态 class 方法未定义

Babel 7 - node static class method is undefined

node.js

ecmascript-6

babeljs