Firebase Cloud Functions 无法识别转译的 ES5:Firebase 未定义

Question

有点介绍一下，目前(在我写这篇文章的时候)Firebase 函数不支持来自较新版本节点的异步和等待等功能。我正在尝试通过将我的代码转换为他们当前支持的节点版本来克服这个问题。

我正在使用 webpack 3 来捆绑我的 react.js Web 应用程序。我已经设置了两个单独的配置 - 一个用于开发，另一个用于生产。我使用第三个配置作为第二个任务在生产 pipiline 上执行，以获取cloudfunctions.js并将其吐到部署目录，functions/index.js使用 babel 转译代码，

我没有在 .babelrc 中描述转译要求，而是使用 webpack 将这些细节添加到规则模块内部的选项配置对象中。

我已经成功地翻译了代码，但Firebase一直在抱怨没有定义"firebase"。我已将此错误的触发器缩小到导入的第一行代码。

任何可以指出我正确方向的建议都非常感谢。

import functions from ''firebase-functions';

事实上，我已经尝试了Commonjs(使用require)，并在ES6导入/导出方面进行了其他尝试。

Package.json：

{
"scripts": {
"start":"node ./node_modules/webpack-dev-server/bin/webpack-dev-server.js --config webpack/dev.config.js",
"build": "cross-env NODE_ENV=production node ./node_modules/webpack/bin/webpack.js --config webpack/prod.config.js"
},
"dependencies": {
"@babel/polyfill": "^7.0.0-beta.40",
"firebase-admin": "^5.5.1",
"firebase-functions": "^0.7.3",
},
"devDependencies": {
"@babel/cli": "^7.0.0-beta.40",
"@babel/core": "^7.0.0-beta.40",
"@babel/plugin-proposal-object-rest-spread": "^7.0.0-beta.40",
"@babel/preset-env": "^7.0.0-beta.40",
"babel-loader": "^8.0.0-beta.0",
"babel-preset-react": "^6.24.1",
"cross-env": "^5.1.3",
"generate-json-webpack-plugin": "^0.2.2",
"uglifyjs-webpack-plugin": "^1.1.8",
"webpack": "^3.10.0",
"webpack-merge": "^4.1.1"
}
}

functions.config.js (webpack)

const
path               = require('path'),
pkg                = require('../package'),
GenerateJsonPlugin = require('generate-json-webpack-plugin'),
UglifyJSPlugin     = require('uglifyjs-webpack-plugin'),
webpack            = require('webpack');
const externals = [
'firebase-admin',
'firebase-functions'
]
const genPackage = () => ({
name         : 'functions',
private      : true,
main         : 'index.js',
license      : 'MIT',
dependencies : externals.reduce( (acc, name) => Object.assign({}, acc, { [name]: pkg.dependencies[name] || pkg.devDependencies[name] }), {} )
})
module.exports = {
entry  : [
'@babel/polyfill',
path.join(__dirname, '../cloudfunctions.js')
],
output : {
path     : path.join(__dirname, '../functions/'),
filename : 'index.js'
},
module : {
rules: [
{
test    : /.js$/,
loader  : 'babel-loader',
options : 
{
presets : [
[ 
'@babel/env',
{ 
option : { 
targets : { 
node : '6.11.5'
}
}
}
]                 
],
plugins: [
'@babel/plugin-proposal-object-rest-spread'
]   
}
,
exclude : /node_modules/
}
]
},
externals : externals.reduce( (acc, name) => Object.assign({}, acc, { [name]: true }), {} ),
plugins   : [
new webpack.DefinePlugin({ 'process.env.NODE_ENV': JSON.stringify(process.env.NODE_ENV) }),
new UglifyJSPlugin(),
new GenerateJsonPlugin('package.json', genPackage())
]
}

周边环境

• 操作系统： 视窗 10
• 节点版本：8.9.4
• Pkg 经理： npm
外壳
• ：视窗外壳
• 浏览器及版本： Chrome 64.0.3282.186
• 语言： 脚本

预期行为

1. 成功转译。
2. 成功部署到火力基地

实际行为

成功转译。 点击firebase deploy --only functions命令后继续收到此日志并出现相同的错误：

i  deploying functions
i  functions: ensuring necessary APIs are enabled...
+  functions: all necessary APIs are enabled
i  functions: preparing functions directory for uploading...
Error: Error occurred while parsing your function triggers.
ReferenceError: firebase is not defined
at Object.module.exports (C:UsersAndrew RedicanCompassfunctionsindex.js:9040:18)
at __webpack_require__ (C:UsersAndrew RedicanCompassfunctionsindex.js:20:30)
at Object.module.exports (C:UsersAndrew RedicanCompassfunctionsindex.js:8967:17)
at __webpack_require__ (C:UsersAndrew RedicanCompassfunctionsindex.js:20:30)
at Object.<anonymous> (C:UsersAndrew RedicanCompassfunctionsindex.js:3687:18)
at __webpack_require__ (C:UsersAndrew RedicanCompassfunctionsindex.js:20:30)
at C:UsersAndrew RedicanCompassfunctionsindex.js:63:18
at Object.<anonymous> (C:UsersAndrew RedicanCompassfunctionsindex.js:66:10)
at Module._compile (module.js:635:30)
at Object.Module._extensions..js (module.js:646:10)

克隆德函数.js [输入]

let functions = require('firebase-functions');
const admin = require('firebase-admin');
admin.initializeApp(functions.config().firebase);

函数/索引.js [输出]

1. 根据我是否包含 Uglify 插件，输出将缩小或正常。
2. Webpack 还接收 @babel/polyfill，因此帮助函数被添加到此文件中。

我没有包含输出文件，因为 unmifinify 版本有 9049 行代码长，而缩小是不合法的。

我试过了

1. 使用过 Babel 6，然后是 Babel 7 仍然没有结果。
2. 环境配置 https://firebase.google.com/docs/functions/config-en
3. 我尝试提供直接硬编码的访问对象。

我明显错过了一些东西，但我已经多次浏览了这篇文章/存储库。

其他注意事项

我正试图尽可能地摆脱打字稿并处理承诺的回调地狱。我也尽量不直接依赖 npm 直接运行命令，而是利用 webpack。

Answer 1

我能够让 webpack 使用 babel 将代码转换为函数/索引.js。我想通了问题所在。

使用 webpack 时，请确保将 output.libraryTarget 指定为 'umd'。

下面是 webpack confg 文件：

const
path               = require('path'),
pkg                = require('../package'),
GenerateJsonPlugin = require('generate-json-webpack-plugin');
const
externals = [
'firebase-admin',
'firebase-functions'
], 
genPackage = () => ({
name    : 'functions',
private : true,
dependencies: externals.reduce(
(acc, name) =>
Object.assign({}, acc, {
[name]:
pkg.dependencies[name] ||
pkg.devDependencies[name]
}),
{}
)
});
module.exports = {
entry : [
'babel-polyfill',
'./cloudfunctions.js'
],
output: {
path          : path.resolve(__dirname,'../functions'),
filename      : 'index.js',
libraryTarget : 'umd'
},
module : {
rules : [
{
exclude : /node_modules/,
loader  : 'babel-loader',
query   : { 
presets : [ 'babel-preset-env' ] 
}
}
]
},
resolve: {
extensions: ['.js']
},
node: {
fs  : 'empty',
net : 'empty',
tls : 'empty'
},
externals: externals.reduce(
(acc, name) => Object.assign({}, acc, { [name]: true }),{}
),
plugins: [
new GenerateJsonPlugin('package.json', genPackage())
]
};

干杯！