Meteor兼容ES6时导入整个模块失效问题求助

我之前在把老Meteor项目转ES6模块的时候也踩过几乎一模一样的坑，给你梳理几个最可能的原因和解决办法：

1. 先检查导入路径是否正确 #

Meteor的ES模块对路径的要求比较严格，尤其是客户端文件导入/both/imports/下的文件时，绝对路径可能不生效，推荐用相对路径来写。比如你的模板JS在client/controller/xxx.js，那导入both/imports/global.js的路径应该是：

// 正确的相对路径写法
import * as Global from '../../both/imports/global.js';

别直接写/both/imports/global.js，Meteor客户端模块的绝对路径解析逻辑和服务端不一样，很容易出问题。

2. 确认export和import的语法匹配 #

先检查你的global.js里的导出写法是否正确，比如如果是多个常量/函数单独导出：

// both/imports/global.js
export const APP_NAME = 'MyMeteorApp';
export function formatDate(date) { /* ... */ }

那导入整个模块的写法是没问题的，但要确保你是通过Global.APP_NAME、Global.formatDate()来调用的，别漏了模块前缀。

如果是用默认导出的话：

// both/imports/global.js
const APP_NAME = 'MyMeteorApp';
function formatDate(date) { /* ... */ }

export default { APP_NAME, formatDate };

那导入的时候就要写成：

import Global from '../../both/imports/global.js';

两种语法别混着用，这是最容易犯的小错误。

3. 处理模板的全局依赖问题 #

原来的/both/global.js是Meteor自动加载的，里面的变量会挂载到全局上下文（比如window），但移到imports目录后，模块里的变量是局部的，模板（比如Blaze模板）直接调用的话会找不到。

如果你的模板里还在直接用这些全局变量，可以先做个过渡：在客户端入口文件（比如client/main.js）里导入模块并挂载到window上：

// client/main.js
import * as Global from '../both/imports/global.js';
window.Global = Global;

这样模板里就能像以前一样用{{Global.APP_NAME}}或者直接调用formatDate()了（如果单独挂载每个变量的话）。当然长远来看，更推荐把这些变量加到模板的helpers里，比如：

// client/controller/yourTemplate.js
import { APP_NAME } from '../../both/imports/global.js';

Template.yourTemplate.helpers({
  appName() {
    return APP_NAME;
  }
});

然后模板里用{{appName}}，这样更符合ES6模块的规范。

4. 确认Meteor版本支持ES模块 #

Meteor 1.5及以上才原生支持ES模块，如果你的版本太老，可能需要升级Meteor，或者额外配置Babel来处理模块语法。可以用meteor --version查看版本，老版本的话建议先升级到最新稳定版。

内容的提问来源于stack exchange，提问作者Danny