javascript - 在 css 注入(inject)上设置正确的目录

Question

这是我的元素

 - Project root

 |-  build
     |-css
     |-js
     |-index.html

 |-  src
     |- css
     |- js
     |-index.html

 |-gulpfile.js

我使用 gulp 并想将 build/scc 和 build/js 文件注入(inject) src/index.html 并将其放置为 build/index.html

这样做:

gulp.task('index', function () {
  var target = gulp.src('src/index.html');
  var sources = gulp.src(['build/js/*.js', 'build/styles/*.css'], { ignorePath: 'build/', addRootSlash: false });
  return target.pipe(inject(sources))
    .pipe(gulp.dest('build'));
});

我需要跳过 '/build/' 部分 但仍然在 html 文件的输出中显示:

<link rel="stylesheet" href="/build/styles/app.min.css">
<script src="/build/js/app.min.js"></script>

Answer 1

- Project root

 |-  build
     |-css
     |-js
     |-index.html

 |-  src
     |- css
     |- js
     |-index.html

 |-gulpfile.js

现在我们在 build 目录(文件夹)中的 index.html 中，我们需要向后退一步才能访问 src 目录，.. 将是当前目录的父目录(表示build)

然后你可以使用这个:

<link rel="stylesheet" href="../build/styles/app.min.css">

阅读更多关于 relative and absolute path 的信息将帮助您了解更多相关信息