包中定义的 MeteorJS javascript 函数未定义

Question

我在 Meteor 中创建了一个自定义包，将 javascript 添加到应用程序中。

我的package.js：

Package.describe({
    name: 'markel:theme',
    version: '1.0.0',
    summary: 'Theme package',
});

Package.onUse(function(api) {
    // Import all JS files required by the template

    api.addFiles(['assets/js/custom.js']);
});

在custom.js:

function theme_test() {
    console.log('Theme test');
}

meteor 在应用程序中加载包时，会将函数放在IIFE 中。所以javascript在(function(){here})。所以我的函数将返回 undefined。

我如何定义该函数并使用它？

Answer 1

我希望这些选项之一能解决您的问题，因为我发现很难重现任何 undefined 值。

选项 1 - 使用模块

虽然您可以通过 api.addFiles 自动添加文件，但您仍然可以选择显式导出它们：

package.js

Package.describe({
    summary: 'Theming',
    version: '1.0.0',
    name: 'marcelweidum:theme',
    git: 'https://github.com/MarcelWeidum/stack-question.git'
});

Package.onUse((api) => {
    api.use('ecmascript') // required to use import/export
    api.addFiles([
        'js/custom.js'
    ], 'client');
    api.mainModule('main.js')
});

package/js/custom.js

export const theme_test = function theme_test () {
    console.log('Here am I!');
}

console.log('Loaded');

package/main.js（在包的根文件夹中）

export { theme_test } from './js/custom'

client/main.js

import { theme_test } from 'meteor/marcelweidum:theme'
theme_test()

会在控制台上给你：

Loaded
Here am I! 

选项 2 - 使用 api.export

您可以使用隐式全局导出主题，该全局可使用api.export 立即访问：

package.js 包.描述（{ 摘要：“主题”， 版本：'1.0.0'， name: 'marcelweidum: 主题', 混帐：'https://github.com/MarcelWeidum/stack-question.git' });

Package.onUse((api) => { api.addFiles([ 'js/custom.js' ]， '客户'）; api.export('我的主题') });

*package/js/custom.js*

函数主题测试（）{ console.log('我在这里！'); }

我的主题 = 我的主题 || {} MyTheme.theme_test = 主题测试

console.log('加载');

*client/main.js*
```javascript
MyTheme.theme_test()

会在控制台上给你：

Loaded
Here am I! 

选项 3 - 显式导入文件

这将仅在文件导入时悬停加载文件的内容

package.js 包.描述（{ 摘要：“主题”， 版本：'1.0.0'， name: 'marcelweidum: 主题', 混帐：'https://github.com/MarcelWeidum/stack-question.git' })

Package.onUse((api) => { api.use('ecmascript') })

*js/custom.js* (in root folder of the package)
```javascript
export const theme_test = function theme_test () {
    console.log('Here am I!');
}

console.log('Loaded');

package/js/custom.js

export const theme_test = function theme_test () {
    console.log('Here am I!');
}

console.log('Loaded');

client/main.js

import { theme_test } from 'meteor/marcelweidum:theme/js/custom'
theme_test()

会在控制台上给你：

Loaded
Here am I! 

选项 4 使用 bare 选项，以防文件被编译器插件使用：

如果您不希望将文件包装在闭包中，例如因为它将被自定义编译器插件使用，则添加 bare 选项：

Package.describe({
    summary: 'Theming',
    version: '1.0.0',
    name: 'marcelweidum:theme',
    git: 'https://github.com/MarcelWeidum/stack-question.git'
});

Package.onUse((api) => {
    api.addFiles([
        'js/custom.js'
    ], 'client',  { bare: true });
});

这仍然会加载文件，但您必须使用 isobuild 插件来处理文件。