JavaScript-Gulp concat并需要路径

2019-10-13 11:34:09 阅读：284 来源： 互联网

我对gulp-concat有问题.我正在尝试将所有js文件连接到一个文件中,例如dist / app.js.

但是有些我不理解.在该文件中,我所需的文件路径仍然与以前相同.

这是我的gulpfile.js：

var gulp       = require("gulp");
var sourcemaps = require("gulp-sourcemaps");
var babel      = require("gulp-babel");
var concat     = require("gulp-concat");
var resolveDependencies      = require("gulp-resolve-dependencies");

gulp.task("default", function () {
  return gulp.src("client/**/*.js")
    .pipe(sourcemaps.init())
    .pipe(babel())
    .pipe(concat("app.js"))
    .pipe(sourcemaps.write("."))
    .pipe(gulp.dest("dist/js"));
});

如您所见,我要合并嵌套文件夹.

以我的/client/components/app.js顶部的示例为例：

import React, {PropTypes} from 'react';
import AppLeftNav from './AppLeftNav';
import {AppCanvas, AppBar, Styles} from 'material-ui';

//Code here

因此,在由gulp生成的应用程序app.js中,我可以看到：

var _AppLeftNav = require('./AppLeftNav');

这是一条相对路径,无法正常工作.

那么,用相对路径处理这些必需文件的技巧是什么？

非常感谢.

编辑：看到我得到的错误：

Error: Cannot find module './components/App.js'
    at Function.Module._resolveFilename (module.js:336:15)
    at Function.Module._load (module.js:278:25)
    at Module.require (module.js:365:17)
    at require (module.js:384:17)
    at Object.<anonymous> (MyFolder\dist\js\app.js:34:24)
    at Module._compile (module.js:460:26)
    at Object.Module._extensions..js (module.js:478:10)
    at Module.load (module.js:355:32)
    at Function.Module._load (module.js:310:12)
    at Module.require (module.js:365:17)

解决方法:

对于可能有相同问题的任何人. Babel当前不支持内联#1681的导入,也不支持gulp-concat,因为它只是连接文件.

我选择使用Rollup正确解决依赖关系,然后才转换输出：

var gulp = require('gulp');
var gutil = require('gulp-util');
var babel = require('gulp-babel');
var concat = require('gulp-concat');
var rollup = require('gulp-rollup');

gulp.task('build', function () {
  return gulp.src('src/parser-factory.js', { read: false })
    .pipe(rollup({ external: ['request', 'cheerio'] }))
    .on('error', gutil.log)
    .pipe(babel({ stage: 0 }))
    .pipe(concat('realty-parser.js'))
    .pipe(gulp.dest('lib'));
});

标签：javascript,gulp,gulp-concat
来源： https://codeday.me/bug/20191013/1907584.html

本站声明： 1. iCode9 技术分享网（下文简称本站）提供的所有内容，仅供技术学习、探讨和分享；
2. 关于本站的所有留言、评论、转载及引用，纯属内容发起人的个人观点，与本站观点和立场无关；
3. 关于本站的所有言论和文字，纯属内容发起人的个人观点，与本站观点和立场无关；
4. 本站文章均是网友提供，不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属；如您发现该文章侵犯了您的权益，可联系我们第一时间进行删除；
5. 本站为非盈利性的个人网站，所有内容不会用来进行牟利，也不会利用任何形式的广告来间接获益，纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。

ICode9

JavaScript-Gulp concat并需要路径