在css注入上设置正确的目录答案

【问题标题】：setting the right directory on css inject在css注入上设置正确的目录
【发布时间】：2016-12-19 09:44:29
【问题描述】：

这是我的项目

 - Project root

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

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

 |-gulpfile.js

我使用 gulp 并希望将 build/scc 和 build/js 文件注入 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>

【问题讨论】：

你试过"../build/xxx"
不，你是怎么做到的？
很简单，只需添加.. 即可跳转到这样的文件夹：<link rel="stylesheet" href="../build/styles/app.min.css">

标签： javascript html css gulp gulp-inject

【解决方案1】：

- Project root

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

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

 |-gulpfile.js

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

那么你可以使用这个：

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

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

【讨论】：