ฉันต้องการจะเขียนเป็นกำหนดเอง Gulp งานนั่นจะเป็นการลบแอททริบิวต์ต่างๆจากของ HTML

Question 1

ฉันต้องการเป็น Gulp องงานที่จะต้องผ่านทุกกำหนดเอกสาร HTML และลบบางแอททริบิวต์ต่างๆ(เช่นรูปแบบ=""). ฉันคิดว่าฉันอาจจะสามารถที่จะทำแบบเดียวกับที่ฉันทำมันผ่านเบราว์เซอร์,แต่ดูเหมือนว่าไม่. นี่คือสิ่งที่ฉันกำลังพยายามทำอย่าง:

// function to take multiple attributes from an element
const discardAttributes = (element, ...attributes) =>
  attributes.forEach((attribute) => element.removeAttribute(attribute));

// run the function on multiple elements
document.querySelectorAll("table, thead, tbody, tr, th, td").forEach((elem) => {
  discardAttributes(elem, "cellspacing", "cellpadding", "width", "style");
});

ฉันต้องไปแล้วเอาไปอยู่เหนือสูตรและสร้างสัมดแก้วงานเหมือนแล้ว:

const gulp = require("gulp");

gulp.task("clean",  async () => {
 gulp.src("src/*.html")
  .pipe(discardAttributes())
    .pipe(gulp.dest("dist"));
});

ถ้ามันมีปลั๊กออก-ในฉันสามารถใช้มันจะทำอย่างนี้ได้โปรดแบ่งปันแต่ก็ฉันอยากจะเรียนรู้ที่จะทำมันด้วยตนเองแบบนี้

ฉันต้องใช้ through2?

ขอบคุณ

Question 2

คุณสามารถใช้ใครบางคนโหนด dom องสมุดและห่อมันกับมดแก้ว ตัวอย่างเช่นคุณสามารถลอง jsdom และ wrapper gulp-dom:

const gulp = require('gulp');
const dom = require("gulp-dom");

gulp.task("default", async () => {
 gulp.src("src/*.html")
  .pipe(dom(function() {

      // function to take multiple attributes from an element
      const discardAttributes = (element, ...attributes) =>
        attributes.forEach((attribute) => element.removeAttribute(attribute));

      // run the function on multiple elements
      return this.querySelectorAll("table, thead, tbody, tr, th, td").forEach((elem) => {
       discardAttributes(elem, "cellspacing", "cellpadding", "width", "style");
    });

  }))
  .pipe(gulp.dest("dist"));
});

Nikolay · Answer 1 · 2021-11-21T17:18:21

คุณสามารถใช้ใครบางคนโหนด dom องสมุดและห่อมันกับมดแก้ว ตัวอย่างเช่นคุณสามารถลอง jsdom และ wrapper gulp-dom:

const gulp = require('gulp');
const dom = require("gulp-dom");

gulp.task("default", async () => {
 gulp.src("src/*.html")
  .pipe(dom(function() {

      // function to take multiple attributes from an element
      const discardAttributes = (element, ...attributes) =>
        attributes.forEach((attribute) => element.removeAttribute(attribute));

      // run the function on multiple elements
      return this.querySelectorAll("table, thead, tbody, tr, th, td").forEach((elem) => {
       discardAttributes(elem, "cellspacing", "cellpadding", "width", "style");
    });

  }))
  .pipe(gulp.dest("dist"));
});

ดูมีความหวังขึ้นฉันจะลองมัน คำถาม:ฉันมองไม่เห็น jsdom ไหนทั้งนั้นอยู่ในรหัสมันเป็นยังไงบ้างมาเล่นที่นี่? ยกโทษของฉันคำถามโง่ๆแต่ผมใหม่ที่จะโหนด. ปรับปรุง:ตาม npm docs,"[Gulp-dom]ส่วนเสริมลุ jsdom. แม้ว่าส่วนเสริมนี้ไม่ได้เปิดใช้งานทั้งหมดคุณสมบัติต่างๆให้โดย jsdom. คนคนเดียวสำหรับ jsdom ในส่วนเสริมนี้ใช้สำหรับคือต้องการวิเคราะห์เป็นเอกสาร HTML ให้เป็น DOM ดังนั้นเราสามารถวิ่งปฏิบัติการบนมัน"
มันได้ผล! ขอบคุณมาก นี่คือสิ่งที่ฉันทำ (1)ฉันติดตั้ง jsdom เป็น devDependancy(2)ฉันติดตั้ง gulp-dom เป็น devDependancy(3)ฉัน pasted รหัสอยู่เหนือและก็วิ่งหมดแก้ว ขอโทษฉันไม่สามารถ upvote เลย
ที่ gulp-dom ส่วนเสริมถึง jsdom ไม่ต้องการที่จะติดตั้งมันไว้แยกต่างหาก ถ้าคุณมีความสุขกับคำตอบที่คุณสามารถยอมรับมัน

ฉันต้องการจะเขียนเป็นกำหนดเอง Gulp งานนั่นจะเป็นการลบแอททริบิวต์ต่างๆจากของ HTML

คำถาม

คำตอบที่ดีที่สุด

ในภาษาอื่นๆ

หน้านี้อยู่ในภาษาอื่นๆ

ดังอยู่ในนี้หมวดหมู่

ดังคำถามอยู่ในนี้หมวดหมู่