Question

尝试使用babel / webpack转换javascript失败的“=”符号。任何可能发生这种情况的想法都会受到很大关注。

import auth0 from './auth0-js'
import { AUTH_CONFIG } from './auth0-variables'


export default class AuthService
{
   auth0=new auth0.WebAuth({
      domain: AUTH_CONFIG.domain,
      clientID: AUTH_CONFIG.clientId,
      redirectUri: AUTH_CONFIG.callbackUrl,
      audience: `https://${AUTH_CONFIG.domain}/userinfo`,
      responseType: 'token id_token',
      scope: 'openid'
    })
}

因此，在上面的示例中，auth0=部分不会与babel / webpack进行转换。

Answer 1

问题不在于你的代码 - 它的教程不够清楚你需要安装什么来编译它。它使用的是浏览器尚不支持的experimental class fields syntax，如果您希望使用它，目前需要a Babel plugin。

如果您查看the .babelrc for the example code，就可以看到他们正在使用以下预设：

"presets": [
    ["env", { "modules": false }],
    "stage-2"
],

stage-2预设包含所有提议的JavaScript功能的插件，这些功能位于标准化过程的第2阶段或更高阶段 - 类字段位于第3阶段，因此它们已包含在内。

类字段使用相当安全，因为它们很可能会在未来几年内添加到规范中 - 也就是说，如果您不想使用实验性功能，那么您可能会失败回到标准的ES2015类语法：

export default class AuthService {
    constructor() {
       this.auth0 = new auth0.WebAuth({
            domain: AUTH_CONFIG.domain,
            clientID: AUTH_CONFIG.clientId,
            redirectUri: AUTH_CONFIG.callbackUrl,
            audience: `https://${AUTH_CONFIG.domain}/userinfo`,
            responseType: 'token id_token',
            scope: 'openid'
       });
    }
}

修改

值得注意的是，Babel团队现在建议在舞台预设中使用各个插件 - 他们计划在Babel 7发布后停止发布后者。有关此背后的基本原理，请参阅their blog post。

赋值运算符

1 个答案: