ค้นหาเว็บไซต์

javascript - วิธีใช้ webpack-chain เพื่อเพิ่มตัวเลือก appendTsSuffixTo ให้กับ ts-loader?


พูดง่าย ๆ ฉันจะใช้ webpack-loader เพื่อเพิ่มตัวเลือกต่อไปนี้ให้กับปลั๊กอิน ts-loader ได้อย่างไร:

options: {
  appendTsSuffixTo: [/\.vue$/]
}

ปัจจุบันฉันมีการตั้งค่านี้สำหรับ ts-loader (ส่วนบนนี้ใส่เพื่อให้เข้าใจบริบท) การเรียกใช้ config.plugin ด้านล่างเป็นพื้นที่ที่ทำให้ฉันมีปัญหา

    chainWebpack: config => {
      config.module
        .rule('typescript')
        .test(/\.tsx?$/)
        .exclude
          .add(/node_modules/)
          .end()
        .use('ts-loader')
          .loader('ts-loader'),

      config
        .plugin('ts-loader')
        .tap( args => { return { appendTsSuffixTo: [/\.vue$/] } }
        )
    }

แต่สิ่งนี้จะทำให้เกิดข้อยกเว้น:

ไม่สามารถอ่านคุณสมบัติ '__expression' ของค่าที่ไม่ได้กำหนดได้

เอกสารของ webpack-loader ไม่ได้อธิบายอย่างชัดเจนว่าควรทำอะไรเมื่อเพิ่มตัวเลือกนั้น

ฉันต้องทำอะไรบ้างเพื่อเพิ่มตัวเลือกนี้?

คำตอบ #1

ดูในส่วนเกี่ยวกับการปรับตัวเลือกสำหรับโหลดเดอร์:

config.module
  .rule('typescript')
  .use('ts-loader')
    .tap(options => merge(options, {
      appendTsSuffixTo: [/\.vue$/]
    }));

อัปเดต

นี่คือเอกสารที่เกี่ยวข้องสำหรับการรวมวัตถุ

กระทู้นี้ใน GitHub ให้ตัวอย่างที่ดี

// preserve existing options
config.module
  .rule('typescript')
  .use('ts-loader')
    .tap(options => ({ ...options, {
      appendTsSuffixTo: [/\.vue$/]
    }}));

บทความที่เกี่ยวข้อง