jonkemp / gulp-useref

Parse build blocks in HTML files to replace references to non-optimized scripts or stylesheets.
MIT License
705 stars 93 forks source link

How work with HTML files in subfolder? #210

Closed cawa-93 closed 7 years ago

cawa-93 commented 8 years ago

I have a simple project

app
├── build
└── src
    ├── page1
    │   ├── index.html
    │   └── js
    │       ├── script1.js
    │       └── script2.js
    ├── page2
    │   ├── index.html
    │   └── js
    │       ├── script3.js
    │       └── script4.js
    └── vendors
        └── js
            ├── vendor1.js
            └── vendor2.js

For example, in page1.html file placed this code

        <!-- build:js ../vendors/js/vendors.js -->
        <script src="../vendors/js/vendor1.js"></script>
        <script src="../vendors/js/vendor2.js"></script>
        <!-- endbuild -->
        <!-- build:js js/script.js -->
        <script src="js/script1.js"></script>
        <script src="js/script2.js"></script>
        <!-- endbuild -->

How do I perform a task to get the following structure?

app
├── build
│   ├── page1
│   │   ├── index.html
│   │   └── js
│   │       └── script.js
│   ├── page2
│   │   ├── index.html
│   │   └── js
│   │       └── script.js
│   └── vendors
│       └── js
│           └── vendors.js
└── src
    ├── page1
    │   ├── index.html
    │   └── js
    │       ├── script1.js
    │       └── script2.js
    ├── page2
    │   ├── index.html
    │   └── js
    │       ├── script3.js
    │       └── script4.js
    └── vendors
        └── js
            ├── vendor1.js
            └── vendor2.js

And the html files would have the following code

<script src="../vendors/js/vendors.js"></script>
<script src="js/script.js"></script>

I tried to do like this:

gulp.task('build', function () {
    return gulp.src('app/src/+(page1|page2)/index.html')
          .pipe(useref())
          .pipe(gulp.dest('app/build'));
});

But as a result, and app/build/js and app/vendors folders were on the higher level than expected

app
├── build
│   ├── js
│   │   └── script.js
│   ├── page1
│   │   └── index.html
│   └── page2
│       └── index.html
├── src
│   ├── page1
│   │   ├── index.html
│   │   └── js
│   │       ├── script1.js
│   │       └── script2.js
│   ├── page2
│   │   ├── index.html
│   │   └── js
│   │       ├── script3.js
│   │       └── script4.js
│   └── vendors
│       └── js
│           ├── vendor1.js
│           └── vendor2.js
└── vendors
    └── js
        └── vendors.js
Abbe98 commented 8 years ago
gulp.task('build', function () {
    return gulp.src('./app/scr/**/*.html')
          .pipe(useref())
          .pipe(gulp.dest('app/build'));
});