Meteor 1.5：Blaze 的动态导入

Question

我有两个问题：

1) 我想为 Blaze 使用 Meteor 1.5 动态导入，但所有示例和教程都是为 React 提供的。所以我很困惑它究竟是如何使用的。谁能举个例子。

2) 我正在使用来自 atmospherejs.com 的软件包，比如我只需要在管理仪表板端使用的 amcharts。如何动态导入它们？

提前致谢！

更新（解决方案）：

下面是homepage.html（父模板）

<template name="homepage">
  Homepage Content
 {{> Template.dynamic template=content}}    
</template>

login.html（子模板）

<template name="login">
  You're logged in!
</template>

login.js

import '../homepage/homepage.js';
import './login.html';
API = function () {
  BlazeLayout.render("homepage",{content: 'login'});
}

export { API }

main.js

LoadLogin = function () {
  import('/imports/modules/common/login/login.js').then(function (api) {
    api.API();
  })
}

/lib/route.js

import { FlowRouter } from 'meteor/ostrio:flow-router-extra';
FlowRouter.route('/', {
  name: 'homepage',
  action() {
    LoadLogin();
  }
});

Answer 1

使用示例link https://github.com/thesaucecode/meteor-amcharts-example/blob/master/client/example2.js非常简单，您只需在Template.MYTEMPLATE.onRendered(function(){});

中编写代码

最重要的是，您可以使用 var chart 作为反应变量。

Answer 2

使用Blaze在Meteor 1.5中动态导入模块的基本技术如下：

Template.theTemplate.events({
  'click button'(event, instance) {
    import("foo").then(Foo => {
      console.log(Foo);
    });
  }
});

请务必仔细查看您的模块随后是如何导入的，因为显然在您的代码中调用它时可能需要进行一些重构。例如，使用 "zxcvbn":

WAS

const result = zxcvbn(pwd);

IS

const result = zxcvbn.default(pwd);

Answer 3

我正在开发我自己的管理面板，Meteor Candy，由动态导入驱动，所以我很乐意分享我是如何让它工作的。

首先，我们有 view.html:

<template name="admin">
    Admin
</template>

其次，我们有我们的JS逻辑：

import { Template } from 'meteor/templating';
import { Meteor } from 'meteor/meteor';
import { Blaze } from 'meteor/blaze';

import './view.html';

API = {}

API.render = function () {
     Blaze.render(Template.admin, document.body);
}

export { API }

最后，我们只需要导入该代码并触发我们的模板呈现到页面中：

openAdmin = function () {
    import('./imports/admins').then(function (api) {
        api.render()
    })
}

一旦运行 openAdmin() 函数，模板将从服务器导入并调用渲染函数。

Meteor 1.5：Blaze 的动态导入

Meteor 1.5 : Dynamic Import for Blaze

meteor

meteor-blaze

meteor-packages

dynamic-import