【问题标题】:Require another file in gulpfile (which isn't in node_modules)需要 gulpfile 中的另一个文件(不在 node_modules 中)
【发布时间】:2016-06-21 05:26:15
【问题描述】:

我已经使用 gulp 一段时间了,并且知道如何导入另一个节点模块,例如

var sass = require('gulp-sass');

没关系,但是我的 gulpfile 中充满了我想移入单独文件并“要求”的代码。具体来说,我正在编写一个 postcss 插件,当在 gulpfile 中声明为函数时,我已经可以使用它了。我的问题是如何将我的函数放在一个外部文件中并像我做一个节点模块一样需要它。我是否需要“导出”所需文件中的功能?我需要使用 ES6 模块或类似的东西吗?

顺便说一句,我意识到如果我这样做,我可能会 (A) 将其转换为适当的节点模块并将其放在私有 NPM 存储库中,但这似乎没有必要,或者 (B) 将其转换为一个合适的 gulp 插件,但这需要学习如何编写 gulp 插件并了解流和东西。这两个可能更好,但需要更多时间,所以我决定暂时保持函数简单和本地化。

【问题讨论】:

  • require('./your_folder/your_file')怎么样
  • 这听起来很简单,但如果我这样做会发生什么? require() 是一个 gulp 函数还是一个新的 javascript 函数,因为我们使用的是更新的 javascript 版本?如果我做了 var myfunction - require('...'); ai 如何确保我的内部函数被分配给变量?
  • 回答我自己的问题,module.exports 和 require() 似乎是 Node 函数,它们不属于 gulp,也不是原生 javascript 函数。

标签: javascript node.js gulp postcss


【解决方案1】:

首先新建一个js文件(这里是./lib/myModule.js):

//./lib/myModule.js
module.exports =  {
    fn1: function() { /**/ },
    fn2: function() { /**/ },
}

您还可以将一些参数传递给您的模块:

// ./lib/myAwesomeModule.js
var fn1 = function() {
}
module.exports =  function(args) {
    fn1: fn1,
    fn2: function() { 
        // do something with the args variable
    },
}

然后在你的 gulpfile 中使用它:

//gulpfile.js
var myModule = require('./lib/myModule')

// Note: here you required and call the function with some parameters
var myAwesomeModule = require('./lib/myAwesomeModule')({
    super: "duper",
    env: "development"
});

// you could also have done
/*
var myAwesomeModuleRequire = require('./lib/myAwesomeModule')
var myAwesomeModule = myAwesomeModuleRequire({
    super: "duper",
    env: "development"
});
*/

gulp.task('test', function() {
   gulp.src()
    .pipe(myModule.fn1)
    .pipe(myAwesomeModule.fn1)
    .gulp.dest()
}

【讨论】:

  • 这看起来正是我所需要的。 SO说我必须等待3分钟才能接受你的回答。据推测,如果我只想返回一个函数,那么我只需将一个函数返回,并将其分配给我的变量。
  • 是的,你只需要module.exports = function(args) {}。见编辑
【解决方案2】:

首先,您必须在文件末尾添加export default <nameOfYourFile>

然后使用它,写import gulp from 'gulp'

如果您有错误消息,请使用 NPM 安装 babel-corebabel-preset-es2015,并在您的 .babelrc 配置文件中添加预设 "presets": ["es2015"]

【讨论】:

    【解决方案3】:

    我通过安装解决了我的问题:

    npm i babel-plugin-add-module-exports

    然后我将 "plugins": [["add-module-exports"]] 添加到 .babelrc

    【讨论】:

      猜你喜欢
      • 1970-01-01
      • 2013-03-06
      • 1970-01-01
      • 1970-01-01
      • 2021-07-17
      • 2016-05-02
      • 1970-01-01
      • 1970-01-01
      • 2016-07-29
      相关资源
      最近更新 更多