如何通过在Meteor中导入不同文件中的es6类来正确使用它们

How to properly use es6 classes in different files by importing them in Meteor?

本文关键字：es6 Meteor 何通过 导入 文件      更新时间：2023-09-26

我最近发现了Meteor，我很难在新的Meteor项目中使用ES6类和导入。我想做的是有一个复杂的类结构，这些方法是从Meteor事件/方法/助手中调用的。我已经通过编写命令$ meteor add grigio:babel将Babel.js添加到该项目中，并且它工作正常。

我试图实现的目标示例：

在服务器/模型/article.js:

class Article {
  static all() {
    //returns all articles from db
  }
}

在server/methods/articles.js:中

Meteor.methods({
  allArticles: {
    Article.all();
  }
})

这样就可以在方法文件中引发ReferenceError: Article is not defined，这就足够了。所以我有三种选择：将所有类写在一个文件中，将所有类附加到全局对象中，或者使用像Browserify这样的好的模块系统。显然，第三种选择更好。

但是我该怎么用呢？默认情况下，Babel将export、import转换为Browserify，Meteor在页面刷新时会引发require is not defined错误。在谷歌上搜索了这个问题后，我没有找到一个关于如何将Browserify添加到Meteor的明确解决方案。我是否应该在Meteor中添加一个支持npm的包，添加一个browserfy的npm包，并在我导入/导出任何内容的每个页面上手动将其添加到Meteor？还是应该使用完全不同的方法？Meteor通常是如何处理这项任务的？非常感谢。

我之前读过这篇文章，在github上发现了这个问题，这可能会有所帮助。

本质上，只需将类分配给一个向客户端和服务器公开的变量（lib/bboth/etc取决于您的文件结构）。像这样：

Article = class Article {...}

似乎是目前最好的解决方案。

我这样做的方法是将对象收集到各种名称空间中，例如：

// Global
Collections = {};

class Article {
  static all() {
    //returns all articles from db
  }
}
_.extend(Collections, { Article });

然后，为了避免在任何地方都使用Collections.Article，我可以在文件中使用以下内容来访问中的Article

// Make `Article` available
let { Article } = Collections;

我使用的是Meteor 1.4.1.1，在重现您的方法时，错误仍然存在。然而，现在有一些新的方法可以使用es6类：

1.将类导出为常量（例如用作单例对象）：

class MyModuleInternalClassName {
   //... class internals
}
export const PublicClassName = new MyModuleInternalClassName();

你可以通过导入这个

import {PublicClassName} from 'path/to/PublicClassFileName.js';

2.将您的类直接导出为模块的默认值

export default class PublicClassName {
   //... class internals
}

然后将其导入（与上面的一样）作为以下

import {PublicClassName} from from 'path/to/PublicClassFileName.js';
let myInstance = new PublicClassName();

++++++++++

关于OP和错误的问题，你可以尝试这样的方法：

文章.js

class InternalArticle {
  constructor(){
     //setup class
  }
  all() {
    //returns all articles from db
  }
  register(article){
     //add article to db
  }
}
export const Article = new InternalArticle();

导入并使用Singleton

import {Article} from 'path/to/Article.js';
//either register some article
Article.register(someArticle);

//or get all your articles
const allArticles = Article.all();
相关文章：