如何使用gulp解析Node JS中的路径?

时间:2020-06-28 16:12:35

标签: javascript node.js gulp

为什么src的错误未定义?

大家好,我在gulp.js上编写程序集时遇到了一个问题,该程序集不是在一个文件中编写的,而是模块化的,因此在解决路径或不正确导出/导入对象时出现问题,我想知道为什么当我向控制台编写路径时会显示对象本身以及嵌入其中的对象。当我尝试接触嵌入式对象时,它会给出不确定的信息。该项目的结构是 Project structure 也就是说,如果我输出路径对象,那么可以看到嵌套对象位于其中

Paths object

但是,如果我尝试获取path.styles.src或仅获取paths.src,那么它将给出未定义的src

Paths.src

任务代码Styles.js

const {dest, src} = require ('../ node_modules / gulp');

const {preprocessor} = require ('./ helpers / VariableHelper');
const paths = require ('./ helpers / PathsHelper');

const sass = require ('gulp-sass');
const scss = require ('gulp-sass');
const less = require ('gulp-less');
const stylus = require ('gulp-stylus');
const cleancss = require ('gulp-clean-css');
const concat = require ('gulp-concat');
const browserSync = require ('browser-sync'). create ();
const autoprefixer = require ('gulp-autoprefixer');
        
console.log (paths.src);

function styles () {
  return src (paths.styles.src)
  .pipe (sass ())
  .pipe (autoprefixer ({overrideBrowserslist: ['last 10 versions'], grid: true}))
  .pipe (cleancss ({level: {1: {specialComments: 0}}, / * format: 'beautify' * /}))
  .pipe (dest ('./ dist'))
  .pipe (browserSync.stream ())
}

exports.styles = styles;

代码VariableHelper.js

const path = require ('path');
let baseDir = path.resolve ('./ src') // If you wanna change you main dev directory, just replace src on another name
preprocessor = 'sass', // If you work with less or scss, just change 'sass' on 'less' for example.
fileswatch = 'html, htm, txt, json, md, woff2', // List of files extensions for watching & hard reload (comma separated)
imageswatch = 'jpg, jpeg, png, webp, svg'; // List of images extensions for watching & compression (comma separated)

exports.baseDir = baseDir;
exports.preprocessor = preprocessor;
exports.fileswatch = fileswatch;
exports.imageswatch = imageswatch;

Code PathsHelper.js

let {baseDir, preprocessor} = require ('./ VariableHelper.js');

let paths = {

  scripts: {
    src: [
      // 'node_modules / jquery / dist / jquery.min.js', // npm vendor example (npm i --save-dev jquery)
      baseDir + '/js/app.js' // app.js. Always at the end
    ],
    dest: baseDir + '/ js',
  },

  styles: {
    src: baseDir + '/' + preprocessor + '/test.sass', // ./src/sass/test.*
    dest: baseDir + '/ css',
  },

  images: {
    src: baseDir + '/ images / src / ** / *',
    dest: baseDir + '/ images / dest',
  },

  deploy: {
    hostname: 'username@yousite.com', // Deploy hostname
    destination: 'yousite / public_html /', // Deploy destination
    include: [/ * '* .htaccess' * /], // Included files to deploy
    exclude: ['** / Thumbs.db', '** / *. DS_Store'], // Excluded files from deploy
  },

  cssOutputName: 'app.min.css',
  jsOutputName: 'app.min.js',

}

console.log (paths.styles.src);

exports.paths = paths;

如果我用硬编码在Style.js中编写return src,则一切正常。

请告诉我为什么无法使用path.src读取值以及如何解决该问题?两个小时以来,我一直在试图了解自己已经写错了什么,并且我通过path.dirname连接了path.resolve并没有进行任何尝试,唯一的猜测是我在导出对象本身时导出了错误。 / p>

0 个答案:

没有答案