初始化

.gitignore

+/node_modules/
+dist
+crx
\ No newline at end of file

crxPack.js

+const fs = require('fs');
+const path = require('path');
+
+const ChromeExtension = require('crx');
+
+const manifest = require('./manifest.json');
+
+const packName = '辅助发货易打单插件';
+
+const crxPath = path.resolve(__dirname, './crx/');
+const buildPath = path.resolve(__dirname, './dist');
+const buildPem = path.resolve(__dirname, './dist.pem');
+
+var deleteFolderRecursive = function(path) {
+  if (fs.existsSync(path)) {
+    fs.readdirSync(path).forEach(function(file, index) {
+      var curPath = path + '/' + file;
+      if (fs.lstatSync(curPath).isDirectory()) {
+        // recurse
+        deleteFolderRecursive(curPath);
+      } else {
+        // delete file
+        fs.unlinkSync(curPath);
+      }
+    });
+    fs.rmdirSync(path);
+  }
+};
+
+deleteFolderRecursive(crxPath);
+
+const privateKey = fs.readFileSync(buildPem);
+
+function buildLikeChromeCrx() {
+  const crx = new ChromeExtension({
+    // 私钥
+    privateKey,
+    // 版本指定2，否则国产浏览器无法安装
+    version: 2,
+  });
+
+  return crx
+    .load(buildPath)
+    .then((crx) => crx.pack())
+    .then((crxBuffer) => {
+      // crx 给国产浏览器使用
+      fs.writeFile(
+        path.resolve(crxPath, `./${packName}${manifest.version}.crx`),
+        crxBuffer,
+        (err) => {
+          err && console.log(err);
+        }
+      );
+
+      console.log(`打包国产浏览器crx完成`);
+    });
+}
+
+function buildChromeCrx() {
+  const crx = new ChromeExtension({
+    // 私钥
+    privateKey,
+    version: 3,
+  });
+
+  return crx
+    .load(buildPath)
+    .then((crx) => crx.pack())
+    .then((crxBuffer) => {
+      // crx 单独给chrome浏览器使用
+      fs.writeFile(
+        path.resolve(crxPath, `./${packName}${manifest.version}.zip`),
+        crxBuffer,
+        (err) => {
+          err && console.log(err);
+        }
+      );
+
+      console.log(`打包谷歌zip完成`);
+    });
+}
+
+// function buildVersionFile() {
+//   fs.writeFile(
+//     path.resolve(crxPath, `./version.json`),
+//     JSON.stringify({ version: manifest.version }),
+//     (err) => {
+//       err && console.log(err);
+//     }
+//   );
+// }
+
+async function task() {
+  console.log(`当前打包版本为: ${manifest.version}`);
+
+  try {
+    fs.mkdirSync('./crx/');
+
+    // buildVersionFile();
+
+    await buildLikeChromeCrx();
+
+    await buildChromeCrx();
+  } catch (error) {
+    console.log('打包失败');
+  }
+}
+
+task();

dist.pem

+-----BEGIN PRIVATE KEY-----
+MIIEvgIBADANBgkqhkiG9w0BAQEFAASCBKgwggSkAgEAAoIBAQDLu2OKZ004sSVd
+Lxs0noeNvs+gxL43t2kNmgeDlN9c9YaoRoWxRil3vB81VARzlDxTLDWWK2yWhS8J
+7rAzzRbOnlEdDZb8sayzO6zPyhhiGSfyTn/a5arG2fj1Um7yAy3iIYQ1gYn8plLa
+dm/bkir8w9n3tIdashX0rcKefXaU2VOIvrlMmPgpkY6F/ithqIr3vAKb90Otbwrr
+KeUOF025Yzl9WvyFIYIZr04vCmm9YfrJmLUlxW3aWh6mWCWhUcaoYkQye/iXbJI6
+HrCXvZTbyavGnQC3aVo81KfTKixIwz0UwRMVnGX6EtjTlyNXrQS5H9VOkUPGcep4
+ZDde29RdAgMBAAECggEABdJ/NoAbw0RAFLDpMTXbmrJ/4AYSB+kYWeYTk2WAhE6p
+pcBNh01W7N/7MKy2li//u60ZLfIOlSGiwGuqF5zjleLiigxD9Z5FQ3ev3rNVmDjE
+UmbUaBF6sdqeWbJx+b1wr6mfYTZobAg7zhhRkN/qlb/UyEEIQjsHKMTYzus30D/1
+qJIKlWWQM8IW5iKbqoDGRGQdZQyb3PXTELDIxjWSz1z4qLkIlWbydNKzSxEbkg8I
+JhoIeYmeDtfGbg2SegOoEJajWSRitrKKqvyx2FayHGITFYkX8ZzyUFP40BTLW3cl
+2ilOE1VvnKf4nT1Fvvkfai+MHOFVMndy5rF88N1guQKBgQDvrlffg4yJCrXgUdi2
+/Ulxsc6QoKElCgrrLLDd+jqX82J8vI4iZkZR7gQls/ze3ontugctjlh1JidWWa9n
+zbwcTc8BQVOT6103zdj52tTpVlktupGVXwfdd5popRuIoETVFPdr4KTKbbExgFdA
+zJl7J/59culI6XkF6Aj147kveQKBgQDZmnOKmJuWP5DV0rYpwha1srjoXOgIHw3f
+Rani0p2jeklQajq3aUnaq9XJu5IKPQR31tp5lT+3M/QZBi+uD8yOeIEdIg8jOQQP
+mGIq0x1YpSLtkS+WNp+HmXAU3lrlL54nTgenMB0ChEWBTEV09N2nNU5FlhdA/6ua
+oca0yKBfBQKBgQDIBNLIcNvDMfD+Ns+IRnAYNa6Q+7v/URYzlKQ1WzGyxSYXurNS
++c8NaHiFjmMlCspIXcrHtdcUTLbfVREQq5ykcjqibYX2F6E/hMXiHUE5SRo7E0uT
+QC8sHzf4xHDp3/YRbOHeYSak2E3bZaNrLFOZd5Ll1hPhCRY6W52+tkBA4QKBgCVu
+DNvVPkYM7xPop87tBM0CTg4iFQN4nAFA0WUjx1vcaAn+C9WKtdp4XlDSA9/g+QjI
+G1J4mrofpKg9SSxOqWgEUGk7d5EeeJVaJ+Cn6c9asHRe2emjwbMocIAWc1oi47ht
+EqHug77wE6iW/weMKyhc4fbUR3G1yMXTeAOW0wclAoGBAKqRbdsSSuyCvRar8n2h
+QAHGcIoJpg8P9JtbwURjrg185CUxXf9PeAz8I5sJiP+E7kJraQcm7yTG2tnXgIZC
+U8OvQbSRH2/Ad2JumOEEKXvi8fsmvRFizU7/XJ+ehkXSsuvzqak5qCa6YdHaniIz
+d0iHC8ZixBZFBx+xLF8ouhWI
+-----END PRIVATE KEY-----

manifest.json

+{
+	"name": "辅助发货易打单1.1.0",
+	"version": "1.0.0",
+	"description": "辅助手机壳厂家打印发货易的快递单",
+
+	"manifest_version": 2,
+	"background": {
+		"scripts": ["background.js"]
+	},
+	"browser_action": {
+		"default_popup": "popup.html",
+		"default_icon": "icon.png",
+		"default_title": "辅助发货易打单"
+	},
+	"icons": {
+		"128": "icon.png"
+	},
+
+	"web_accessible_resources": ["icon.png"],
+
+	"content_scripts": [
+		{
+			"matches": [
+				"*://*.fahuoyi.com/*",
+				"*://admin.rtxmdz.com/*",
+				"http://localhost:8082/*",
+				"http://localhost:8083/*",
+				"*://*.rtxmdz.com/*"
+			],
+			"js": ["content.js"],
+			"run_at": "document_idle"
+		}
+	],
+
+	"permissions": [
+		"background",
+		"storage",
+		"contextMenus",
+		"tabs",
+		"cookies",
+		"webRequest",
+		"management",
+		"activeTab",
+		"history",
+		"notifications",
+		"webRequestBlocking",
+		"http://*/*",
+		"https://*/*",
+		"downloads"
+	]
+}

package.json

+{
+  "name": "linkfahuoyi-exension",
+  "version": "1.0.0",
+  "main": "index.js",
+  "license": "MIT",
+  "scripts": {
+    "dev": "cross-env NODE_ENV=development webpack --config ./webpack/webpack.dev.js --watch",
+    "build": "cross-env NODE_ENV=production webpack --config ./webpack/webpack.prod.js"
+  },
+  "devDependencies": {
+    "@types/chrome": "^0.0.126",
+    "@types/react": "^17.0.0",
+    "@types/react-dom": "^17.0.0",
+    "antd": "^4.9.3",
+    "clean-webpack-plugin": "^3.0.0",
+    "copy-webpack-plugin": "^7.0.0",
+    "cross-env": "^7.0.3",
+    "crx": "^5.0.1",
+    "css-loader": "^5.0.1",
+    "html-webpack-plugin": "^4.5.0",
+    "node-sass": "^5.0.0",
+    "sass-loader": "^10.1.0",
+    "style-loader": "^2.0.0",
+    "ts-loader": "^8.0.12",
+    "webpack": "^5.10.1",
+    "webpack-cli": "^4.2.0",
+    "webpack-merge": "^5.7.0"
+  },
+  "dependencies": {
+    "react": "^17.0.1",
+    "react-dom": "^17.0.1",
+    "typescript": "^4.1.3"
+  }
+}

public/index.html

+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Document</title>
+</head>
+<body>
+    <div id="root"></div>
+</body>
+</html>
\ No newline at end of file

src/background/index.ts

+
+import { factoryContentUrls } from "../config";
+import { StartPrint, Print } from "../types";
+
+//     platform: PlatformCode,// 平台编码，淘系及其他平台订单模板的为0，拼多多订单的为1，京东订单的为2
+const PlatfromsMap = new Map([
+    [0, /.+:\/\/a.*\.fahuoyi.com\/scanPrinting\/index/],
+    [1, /.+:\/\/pdd.*\.fahuoyi.com\/scanPrinting\/index/],
+    [2, /.+:\/\/jd.*\.fahuoyi.com\/scanPrinting\/index/]
+])
+chrome.runtime.onMessage.addListener(function (message, sender, sendResponse) {
+
+    if (message.action === StartPrint) {
+        // console.log("startPrint")
+        // 通知fahuoyi的content开始点击
+        chrome.tabs.query({
+            url: "*://*.fahuoyi.com/scanPrinting/index"
+        }, function (tabs) {
+            let exp = new RegExp(PlatfromsMap.get(message.value.platform)!, 'i')
+
+            console.log(tabs, 'tabs66')
+            tabs && tabs.forEach(tab => {
+                if (exp.test(tab.url!)) {
+                    chrome.tabs.sendMessage(tab.id!, { action: Print, value: message.value })
+                }
+            })
+            // // sendResponse("")
+            // if (tabs[0]) {
+            //     chrome.tabs.sendMessage(tabs[0].id!, { action: Print, value: message.value })
+            // }
+        })
+        chrome.tabs.query({
+            url: "*://*.fahuoyi.com/features/scanPrinting"
+        }, function (tabs) {
+            console.log(tabs, 'tabs11')
+            tabs && tabs.forEach(tab => {
+                chrome.tabs.executeScript(tab.id!, {code: 'console.log(window["scan-printing-form"])'});
+            })
+        })
+    } else if (message.action === "sendNewWaybillNo") {
+
+        // 从bg页面转发给厂家页面的content.js
+        chrome.tabs.query({
+            url: factoryContentUrls
+        }, function (tabs) {
+            tabs && tabs.forEach(tab => {
+                // chrome.tabs.sendMessage(tab.id!, message)
+                const port = chrome.tabs.connect(tab.id!, { name: "sendNewWaybillNo" })
+                port.onMessage.addListener(function (msg, port) {
+                    if (msg.action === "answer") {
+                        // console.log(msg, port, 'bg')
+                        port.disconnect()
+                    }
+                })
+                port.postMessage(message)
+
+            })
+        })
+        // let port = chrome.runtime.connect({ name: "bgSendMessage" })
+        // port.postMessage(message)
+    }
+})
+// chrome.runtime.onConnect.addListener(function (msg) {
+//     console.log(msg, 'msgbg')
+// })
\ No newline at end of file

src/config.ts

+export const factoryContentUrls = ["http://localhost:8082/*", "http://localhost:8083/*", "*://admin.rtxmdz.com/*", "*://*.rtxmdz.com/*"]

src/content/index.ts

+
+
+
+import { message } from "antd";
+
+import { Print, StartPrint } from "../types";
+
+export enum PlatformCode {
+    "淘系及其他平台订单模板" = 0,
+    "拼多多订单模板" = 1,
+    "京东订单模板" = 2
+}
+
+type Params = {
+    waybillNo: string // 运单号
+    platform: PlatformCode,
+    wayCompanyId: string
+} & {
+    orderNo: string// 订单号
+    wayCompanyId: string// 快递公司的Id
+    platform: PlatformCode,// 平台编码，淘系及其他平台订单模板的为0，拼多多订单的为1，京东订单的为2
+}
+
+interface Response {
+    data: {
+        action: "StartPrint",
+        value: Params
+    }
+}
+window.addEventListener("message", function (res: Response) {
+
+    if (res.data.action === "StartPrint") {
+        chrome.storage?.local.get({ list: [] }, function (storage) {
+            // @ts-ignore
+            if (storage.list.length == 0 || !storage.list[0].wayCompanyId || !storage.list[0].waybillTemplateList.some(item => item)) {
+                alert("请选择快递模板")
+                return;
+            }
+            const { wayCompanyId, waybillNo, orderNo, platform } = res.data.value
+            if (!waybillNo && (!wayCompanyId || !orderNo || ![0, 1, 2].includes(Number(platform)))) {
+                alert("参数传递错误")
+                return;
+            }
+            chrome.runtime.sendMessage({ action: StartPrint, value: res.data.value }, function (response) {
+
+            })
+        })
+
+    }
+})
+enum SelectOptions {
+    "waybillNo" = "waybillNo",
+    "orderOriginalId" = "orderOriginalId"
+}
+// fahuoyi.com
+interface Message {
+    action: "Print",
+    value: Params
+}
+const printWayBillByOld = function (waybillNo: string, wayCompanyId: string) {
+    chrome.storage.local.get({ list: [], isAutoEmit: false }, function (res) {
+        // 选择使用旧单号打印
+        let oldOptionDom = document.querySelectorAll(".form-group.mr20>.radio-inline")[1] as HTMLLabelElement
+        let waybillNoBtn = document.querySelector(".form-group>.form-control.original-id-input-label>option[value=waybillNo]") as HTMLOptionElement
+        let selectDom = document.querySelector("select.form-control.original-id-input-label") as HTMLSelectElement
+        let inputDom = document.querySelector(".form-group>.form-control.original-id-input") as HTMLInputElement
+        let serachBtn = document.querySelector(".form-group>.btn.btn-primary[type=button]") as HTMLButtonElement
+        let printDom = document.querySelector("#elContainer>div>.form-inline.panel-border.p15.search-panel>div[class]>.form-group.mr20[style]>select.form-control") as HTMLSelectElement
+        let autoDom = document.querySelectorAll("#elContainer>div>.form-inline.panel-border.p15.search-panel>div.mt10>div.form-group.mr20>select.form-control")[1] as HTMLSelectElement
+        // 默认参数写死
+        let hiddenInputDom = document.querySelector("#forcePrintMergerOrderInput") as HTMLInputElement
+
+        let printId: string
+        // @ts-ignore
+        res.list.forEach(item => {
+
+            if (item.wayCompanyId === wayCompanyId) {
+                printId = item.printId === "仅获取电子面单号不打印面单" ? "isGenerateWaybillNoOnly" : item.printId
+                // printId = item.printId
+            }
+
+        })
+
+        // 1.选择旧单号打印
+        oldOptionDom.click()
+
+        // 2.选择打单模板
+        waybillNoBtn.selected = true
+        selectDom.value = SelectOptions.waybillNo
+        // @ts-ignore
+        selectDom.dispatchEvent(new Event("change", { bubbles: true }))
+        // 3.选择打印机
+        printDom.value = printId!
+        printDom.dispatchEvent(new Event("change", { bubbles: true }))
+        // 4.自动发货
+        autoDom.value = "true"
+        autoDom.dispatchEvent(new Event("change", { bubbles: true }))
+        // 5.自己联系快递公司
+        let bySelf = document.querySelectorAll("#elContainer>div>.form-inline.panel-border.p15.search-panel>div.mt10>div.form-group.mr20>select.form-control")[2] as HTMLSelectElement
+        bySelf.value = "OFFLINE"
+        bySelf.dispatchEvent(new Event("change", { bubbles: true }))
+        // 6.输入运单号
+        // selectDom.__reactEventHandlers$8wsw7c8olk.onChange({ target: { value: SelectOptions.waybillNo } })
+        inputDom.value = waybillNo
+
+        // 7.默认参数写死
+        hiddenInputDom.value = "true"
+
+        serachBtn.click()
+    })
+
+}
+
+const printWayBillByNew = function ({ orderNo, wayCompanyId, platform }: Pick<Params, "orderNo" | "wayCompanyId" | "platform">) {
+    // console.log(orderNo, wayCompanyId, platform)
+    // 根据快递公司的companyId选择相应的配置
+    chrome.storage.local.get({ list: [], isAutoEmit: false }, function (res) {
+        // console.log(res, 'res') //res:{isAutoEmit:boolean,list:[{waybillCompanyId:"",waybillTemplateList:[x,x,x]}]}
+        let waybillTemplate: string;
+
+        let printId: string;
+
+        // @ts-ignore
+        res.list.forEach(item => {
+
+            if (item.wayCompanyId === wayCompanyId) {
+                waybillTemplate = item.waybillTemplateList[platform]
+                printId = item.printId === "仅获取电子面单号不打印面单" ? "isGenerateWaybillNoOnly" : item.printId
+                // printId = item.printId
+            }
+
+        })
+
+        let newOrderBtn = document.querySelector(".form-group.mr20>.radio-inline.mr10") as HTMLLabelElement
+
+
+        let wayTemplateSelect = document.querySelector(".form-group.mr20>.form-control.waybill-template-select") as HTMLSelectElement
+
+        // let orderBtn = document.querySelector(".form-group>.form-control.original-id-input-label>option[value=orderOriginalId]") as HTMLOptionElement
+        let selectDom = document.querySelector("select.form-control.original-id-input-label") as HTMLSelectElement
+        let inputDom = document.querySelector(".form-group>.form-control.original-id-input") as HTMLInputElement
+
+        let searchDom = document.querySelector(".form-group>.btn.btn-primary") as HTMLButtonElement
+
+        let printDom = document.querySelector("#elContainer>div>.form-inline.panel-border.p15.search-panel>div[class]>.form-group.mr20[style]>select.form-control") as HTMLSelectElement
+        let autoDom = document.querySelectorAll("#elContainer>div>.form-inline.panel-border.p15.search-panel>div.mt10>div.form-group.mr20>select.form-control")[1] as HTMLSelectElement
+
+        // 默认参数写死
+        let hiddenInputDom = document.querySelector("#forcePrintMergerOrderInput") as HTMLInputElement
+
+        //1.点击 获取新单号打印
+        newOrderBtn.click()
+        //2.选择快递单模板
+        wayTemplateSelect.value = waybillTemplate! + ""
+        wayTemplateSelect.dispatchEvent(new Event("change", { bubbles: true }))
+
+        //3.点击订单编号
+        selectDom.value = SelectOptions.orderOriginalId
+        // @ts-ignore
+        selectDom.dispatchEvent(new Event("change", { bubbles: true }))
+
+        // 4. 选择打印机
+        printDom!.value = printId!
+
+        printDom.dispatchEvent(new Event("change", { bubbles: true }))
+        // orderBtn.click()
+
+        // 5.自动发货
+        autoDom.value = "true"
+        autoDom.dispatchEvent(new Event("change", { bubbles: true }))
+        // 6.自己联系快递公司
+        let bySelf = document.querySelectorAll("#elContainer>div>.form-inline.panel-border.p15.search-panel>div.mt10>div.form-group.mr20>select.form-control")[2] as HTMLSelectElement
+        bySelf.value = "OFFLINE"
+        bySelf.dispatchEvent(new Event("change", { bubbles: true }))
+        //7.输入订单编号
+        inputDom.value = orderNo
+
+        // 8.默认参数写死
+        hiddenInputDom.value = "true"
+
+        //9.点击搜索并打印
+        searchDom.click()
+
+    })
+}
+
+//发货易页面
+
+chrome.runtime.onMessage.addListener(function (message: Message, sender, response) {
+
+    if (message.action === Print) {
+        if (message.value.waybillNo) {
+            printWayBillByOld(message.value.waybillNo, message.value.wayCompanyId)
+        } else {
+            const { orderNo, wayCompanyId, platform } = message.value
+
+            printWayBillByNew({ orderNo, wayCompanyId, platform })
+        }
+    }
+
+
+})
+
+// 拿到打印机
+chrome.runtime.onConnect.addListener(function (port) {
+    if (port.name === "getPrinter") {
+        port.onMessage.addListener(function (msg) {
+
+            if (msg.action === "getPrint") {
+
+                // @ts-ignore
+                let options: HTMLOptionElement[] = document.querySelectorAll("#elContainer>div>.form-inline.panel-border.p15.search-panel>div[class]>.form-group.mr20[style]>select.form-control>option")
+                // console.log(2)
+                // console.log(options, options[0].value, '3')
+
+                let arr = []
+                for (let i = 0; i < options.length; i++) {
+
+                    arr.push(options[i].textContent)
+                    // arr.push(options[i].value)
+                }
+
+                port.postMessage(arr)
+
+            }
+        })
+    }
+})
+
+// 厂家content.js页面
+// chrome.runtime.onMessage.addListener(function (message, sender, response) {
+//     if (message.action === "newWaybillNo") {
+//         window.postMessage(message, "*")
+//     }
+// })
+// let FactoryPost = chrome.runtime.connect({ name: "getMessage" })
+// FactoryPost.onMessage.addListener(function (msg) {
+//     if (msg.action === "newWaybillNo") {
+//         window.postMessage(msg, "*")
+//     }
+// })
+chrome.runtime.onConnect.addListener(function (port) {
+    if (port.name === "sendNewWaybillNo") {
+
+        // console.log(port, 'port')
+        port.onMessage.addListener(function (msg) {
+            // console.log(msg, 'msg')
+
+            if (msg.action === "sendNewWaybillNo") {
+
+
+                window.postMessage({ action: "newWaybillNo", message: msg?.message, orderNo: msg?.orderNo, waybillNo: msg?.waybillNo, result: msg.result }, '*')
+
+                port.postMessage({ action: "answer" })
+            }
+        })
+    }
+
+})
+
+// inject.js
+
+const startPrintWayBill = function (params: Params) {
+
+    // 通知content.js触发事件
+    window.postMessage({ action: "StartPrint", value: params }, "*")
+    return new Promise(function (resolve, reject) {
+        // @ts-ignore
+        window.onmessage = function (res) {
+
+            if (res.data.action === "newWaybillNo") {
+                console.log(res.data, 'res.data')
+                res.data.result ? resolve(res.data.waybillNo) : reject(res.data);
+
+            }
+        }
+    })
+
+
+
+};
+
+/**
+ * 发货易content
+ */
+
+window.addEventListener("message", function (msg) {
+
+    if (msg.data.action === "sendNewWaybillNo") {
+
+        // chrome.runtime.onConnect.addListener(function (port) {
+        //     console.log(port, 'port')
+        //     port.postMessage(msg.data)
+        // })
+        chrome.runtime.sendMessage(msg.data)
+    }
+
+})
+
+function injectCustomjs() {
+
+    let temp = document.createElement("script")
+    temp.innerHTML = `window.startPrintWayBill=${startPrintWayBill}`
+    document.body.appendChild(temp)
+
+
+    let tbodyDom = document.querySelector("#elContainer>div>table>tbody")
+
+    if (tbodyDom) {
+        let observe = new MutationObserver(function (mutations, observe) {
+            console.log(mutations, 'mutations')
+
+            let td = mutations[0].addedNodes[0].childNodes[3]
+            console.log(td, 'td')
+
+
+            if (!td) return;
+            let tdObserve = new MutationObserver(function (mutations, observe) {
+                console.log(mutations, 'mutations')
+                mutations.forEach(item => {
+
+                    item.addedNodes.forEach(node => {
+
+
+                        // @ts-ignore
+                        if (node.nodeType == 3 && node.parentElement?.className.includes("text-danger")) {
+
+                            console.log(node.textContent, 'nodeTextContent')
+                            // @ts-ignore
+                            return window.postMessage({ action: "sendNewWaybillNo", message: node?.wholeText, result: false }, "*")
+                        }
+                        if (node.nodeName == "DIV") {
+                            let text = node.childNodes[2].textContent;
+                            let orderNo = item.target.parentElement?.children[0]?.children[0]?.childNodes[0]?.textContent
+                            console.log(orderNo, 'orderNo')
+                            window.postMessage({ action: "sendNewWaybillNo", waybillNo: text, orderNo, result: true }, "*")
+                            // 从发货易页面发消息给bg
+                            // chrome.runtime.sendMessage({ action: "newWaybillNo", value: text }, function (res) {
+
+                            // })
+                            // console.log("fahuoyi")
+                            // let fahuoyiPort = chrome.runtime.connect({ name: "sendMessage" })
+                            // fahuoyiPort.postMessage({ action: "newWaybillNo", value: text })
+                            // chrome.runtime.onConnect.addListener(function (port) {
+                            //     console.log(port, 'port')
+                            //     port.postMessage({ action: "newWaybillNo", value: text })
+                            // })
+
+                        }
+                    })
+                })
+            })
+            tdObserve.observe(td, {
+                childList: true,
+                characterData: true,
+                subtree: true,
+                attributes: true
+            })
+
+
+
+        })
+
+
+        observe.observe(tbodyDom!, {
+            childList: true,
+
+        })
+        let bfqxDom = document.querySelector("body")
+        let observe1 = new MutationObserver(function (mutations, observe) {
+            // mutations[0].addedNodes[0].className
+            console.log(mutations, 'bfqxDom')
+            mutations.forEach(item => {
+                item.addedNodes.forEach(node => {
+                    // node.textContent == 'bootbox modal fade sui-modal in' && 
+                    if (node.textContent == '× 该订单有商品正在退款中或者已取消，是否确认继续打印？确定取消') {
+                        let bfqxyesbtn = document.querySelector(".btn.btn-primary.bootbox-accept") as HTMLButtonElement
+                        let bfqxnobtn = document.querySelector(".btn.btn-default.bootbox-cancel") as HTMLButtonElement
+                        console.log('bfqxyesbtn', bfqxyesbtn)
+                        bfqxyesbtn.click()
+                    }
+                })
+            })
+        })
+    
+        observe1.observe(bfqxDom!, {
+            childList: true,
+    
+        })
+    }
+
+}
+
+
+
+injectCustomjs()
+
+

src/popup/components/IsAutoEmit/index.tsx

+import React,{ useCallback, useContext, useEffect, useState } from "react";
+import { Checkbox } from "antd";
+const IsAutoEmit = function () {
+     const [checked, setChecked] = useState<boolean>(false)
+    
+
+    const changeRadio = useCallback((e) => {
+        setChecked(e.target.checked)
+    }, [])
+    
+    useEffect(() => {
+        chrome.storage.local.get({ isAutoEmit: false }, function (res) {
+   
+            setChecked(res.isAutoEmit)
+        })
+    }, [])
+    useEffect(() => {
+        chrome.storage.local.set({isAutoEmit:checked})
+    },[checked])
+    return <>
+        <span className="waybill-panel-title">自动发货</span>
+        <Checkbox checked={ checked } onChange={ changeRadio } style={ { marginLeft: "13px" } }>打印成功后自动发货</Checkbox>
+    </>
+}
+
+export default IsAutoEmit
\ No newline at end of file

src/popup/components/WayBillModel/index.scss

+.waybill-model{
+    width: 809px;
+    max-height: 200px;
+    overflow-y: auto;
+   overflow-x: hidden;
+    display: grid;
+    justify-items: center;
+    align-items: center;
+    grid-template-columns: 1fr 1.1fr repeat(3,1fr) 44px;
+    grid-auto-rows: 40px;
+}
\ No newline at end of file

src/popup/components/WayBillModel/index.tsx

+import React, { useState, useCallback, useEffect } from "react";
+import { Select, Button } from "antd";
+import "./index.scss";
+
+const { Option } = Select
+export interface IwaybillTemplate {
+    name: string,
+    value: string
+}
+interface Item {
+    wayCompanyId: string | undefined,
+    waybillTemplateList: (string | undefined)[]
+    printId: string | undefined
+}
+type List = Item[]
+
+//
+const AllWayCompany = [
+    { name: "圆通速递", value: "YTO" }
+    , { name: "申通快递", value: "STO" }
+    , { name: "中通快递", value: "ZTO" }
+    , { name: "韵达快递", value: "YUNDA" }
+    , { name: "顺丰速运", value: "SF" }
+    , { name: "百世快递", value: "HTKY" }
+    , { name: "EMS", value: "EMS" }
+    , { name: "EMS经济快递", value: "EYB" }
+    , { name: "邮政标准快递", value: "DISTRIBUTOR_1715055" }
+    , { name: "邮政快递包裹", value: "POSTB" }
+    , { name: "中国邮政", value: "POST" }
+    , { name: "京东快递", value: "EX_JD_EXPRESS" }
+    , { name: "天天快递", value: "TTKDEX" }
+    , { name: "国通快递", value: "GTO" }
+    , { name: "安能快递(小包)", value: "DISTRIBUTOR_12017865" }
+    , { name: "安能物流", value: "ANE56" }
+    , { name: "全峰快递", value: "QFKD" }
+    , { name: "联邦快递", value: "FEDEX" }
+    , { name: "德邦快递", value: "DBKD" }
+    , { name: "德邦物流", value: "DBL" }
+    , { name: "宅急送", value: "ZJS" }
+    , { name: "优速快递", value: "UC" }
+    , { name: "龙邦速递", value: "LB" }
+    , { name: "亚风", value: "AIR" }
+    , { name: "天地华宇", value: "HOAU" }
+    , { name: "速尔快运", value: "SURE" }
+    , { name: "大田", value: "DTW" }
+    , { name: "保宏物流", value: "BHWL" }
+    , { name: "发网", value: "UNIPS" }
+    , { name: "长发", value: "YUD" }
+    , { name: "长宇", value: "CYEXP" }
+    , { name: "远长", value: "YC" }
+    , { name: "东方汇", value: "DFH" }
+    , { name: "飞远配送 ", value: "GZLT" }
+    , { name: "派易国际物流77", value: "PKGJWL" }
+    , { name: "信丰物流", value: "XFWL" }
+    , { name: "飞远(爱彼西)配送", value: "HZABC" }
+    , { name: "华强物流", value: "SHQ" }
+    , { name: "百世物流", value: "BEST" }
+    , { name: "新邦物流", value: "XB" }
+    , { name: "美国速递", value: "MGSD" }
+    , { name: "远成快运", value: "YCKY" }
+    , { name: "品骏快递", value: "PJBEST" }
+    , { name: "苏宁物流", value: "DISTRIBUTOR_13452378" }
+    , { name: "WnDirect", value: "WND" }
+    , { name: "能达速递", value: "NEDA" }
+    , { name: "黑猫宅急便", value: "YCT" }
+    , { name: "D速物流", value: "DISTRIBUTOR_13460212" }
+    , { name: "联昊通", value: "LTS" }
+    , { name: "E速宝", value: "ESB" }
+    , { name: "佳吉快递", value: "CNEX" }
+    , { name: "广东EMS", value: "GDEMS" }
+    , { name: "增益速递", value: "QRT" }
+    , { name: "全一快递", value: "UAPEX" }
+    , { name: "快捷快递", value: "FAST" }
+    , { name: "中铁快运", value: "CRE" }
+    , { name: "速通物流", value: "EX_SUT56" }
+    , { name: "顺丰快运", value: "EX_SFKY" }
+    , { name: "速腾快递", value: "EX_STE56" }
+    , { name: "顺心捷达", value: "DISTRIBUTOR_13484485" }
+    , { name: "宽昊物流", value: "EX_KHWL" }
+    , { name: "都市节奏", value: "EX_DSJZ" }
+    , { name: "众邮快递", value: "EX_ZYKD" }
+    , { name: "京东快运", value: "EX_JDKY" }
+    , { name: "DN快递", value: "EX_TOPSPEED_DN" }
+    , { name: "九曳供应链", value: "DISTRIBUTOR_13323734" }
+    , { name: "重庆华宇物流", value: "EX_CQHY" }
+    , { name: "极兔速递", value: "EX_JTSD" }
+    , { name: "丹鸟", value: "DISTRIBUTOR_13503931" }
+    , { name: "如风达配送", value: "BJRFD-001" }
+    , { name: "韵达点通达", value: "EX_YUNDA_DTD" }
+    , { name: "壹米滴答", value: "YMDD" }
+    , { name: "百世国际", value: "DISTRIBUTOR_13433751" }
+    , { name: "安迅物流", value: "DISTRIBUTOR_13365751" }
+    , { name: "承诺达特快", value: "DISTRIBUTOR_13469985" }
+    , { name: "沃埃家", value: "EX_WOWVIP" }
+    , { name: "京广速递", value: "EX_SZKKE" }
+    , { name: "鸿昌物流", value: "EX_HC" }
+    , { name: "华企快运", value: "EX_HUAQIEX" }
+    , { name: "中骅物流", value: "EX_CHUNGHWA56" }
+    , { name: "百世快运", value: "BESTQJT" }
+    , { name: "运通速运", value: "WTO" }
+    , { name: "中通快运", value: "DISTRIBUTOR_13222803" }
+    , { name: "菜鸟大件-日日顺配", value: "DISTRIBUTOR_13159132" }
+    , { name: "安世通快递", value: "DISTRIBUTOR_13415300" }
+    , { name: "百世云配", value: "DISTRIBUTOR_13468073" }
+    , { name: "韵达快运", value: "DISTRIBUTOR_13421750" }
+    , { name: "中通国际直邮", value: "DISTRIBUTOR_13196453" }
+    , { name: "京东大件开放承运商", value: "EX_JD_HPCP" }
+    , { name: "加运美速递", value: "DISTRIBUTOR_13468074" }
+    , { name: "中运全速", value: "EX_TOPSPEED" }
+    , { name: "其他", value: "OTHER" }
+    , { name: "跨越速运", value: "DISTRIBUTOR_13211725" }
+    , { name: "菜鸟大件-中铁配", value: "DISTRIBUTOR_13148625" }
+]
+
+const PlatformsMap = new Map([
+    [0, /.+:\/\/a.*\.fahuoyi.com\//],
+    [1, /.+:\/\/pdd.*\.fahuoyi.com\//],
+    [2, /.+:\/\/jd.*\.fahuoyi.com\//]
+])
+const WayBillModel = function () {
+
+    const [list, setList] = useState<List>([])
+    const [AWaybillTemplate, setAWaybillTemplate] = useState<IwaybillTemplate[]>([])
+    const [PDDWaybillTemplate, setPDDWaybillTemplate] = useState<IwaybillTemplate[]>([])
+    const [JDWaybillTemplate, setJDWaybillTemplate] = useState<IwaybillTemplate[]>([])
+
+    const [printList, setPrintList] = useState<string[]>([])
+
+
+    const setMap = new Map([
+        [0, setAWaybillTemplate],
+        [1, setPDDWaybillTemplate],
+        [2, setJDWaybillTemplate]
+    ])
+    const getMap = new Map([
+        [0, AWaybillTemplate],
+        [1, PDDWaybillTemplate],
+        [2, JDWaybillTemplate]
+    ])
+    // 获取发货易快递模板列表
+    const getWaybillTemplate = useCallback(async () => {
+        chrome.tabs.query({
+            url: "*://*.fahuoyi.com/scanPrinting/index"
+        }, async function (tabs) {
+
+
+            let platformUrls: string[] = []
+            for (let value of PlatformsMap.values()) {
+
+                let prefixUrl: string;
+                tabs.forEach(tab => {
+                    console.log(value.test(tab.url!))
+                    if (tab.url && value.test(tab.url!)) {
+                        prefixUrl = tab.url.match(value)![0]
+                        console.log(prefixUrl, 'url')
+                    }
+                })
+
+                platformUrls.push(prefixUrl!)
+
+                console.log(platformUrls, 'platformUrls')
+            }
+            for (let index in platformUrls) {
+                let prefix = platformUrls[index]
+                console.log(prefix, 'prefix')
+                let data = prefix ? await fetch(prefix + "waybillTemplate/listRest?_=" + new Date().getTime(), { method: "GET" }).then(res => {
+                    console.log("2")
+                    return res.json()
+
+                }) : []
+                console.log("3")
+                console.log(data, 'data')
+                setMap.get(Number(index))!(pre => {
+                    // @ts-ignore
+                    return data.map(dataItem => ({
+                        name: dataItem.name,
+                        value: dataItem.id
+                    }))
+                })
+            }
+
+
+
+        })
+
+    }, [])
+
+    const getPrintList = useCallback(async () => {
+        chrome.tabs.query({
+            url: "*://*.fahuoyi.com/scanPrinting/index"
+        }, async function (tabs) {
+
+            if (tabs.length >= 1) {
+                let port = chrome.tabs.connect(tabs[0].id!, { name: "getPrinter" });
+                port.postMessage({ action: "getPrint" })
+                port.onMessage.addListener(function (msg) {
+                    setPrintList(msg)
+                })
+
+
+            }
+
+        })
+
+    }, [])
+
+    useEffect(() => {
+        getWaybillTemplate()
+        getPrintList()
+        chrome.storage.local.get({ list: [{ wayCompanyId: undefined, waybillTemplateList: [undefined, undefined, undefined], printId: undefined }] }, function (res) {
+            if (res.list.length === 0) {
+                chrome.storage.local.set({ list: [{ wayCompanyId: undefined, waybillTemplateList: [undefined, undefined, undefined], printId: undefined }] }, function () {
+                    setList([{ wayCompanyId: undefined, waybillTemplateList: [undefined, undefined, undefined], printId: undefined }])
+                })
+            } else {
+                setList(res.list as List)
+            }
+
+        })
+    }, [])
+
+    useEffect(() => {
+        chrome.storage.local.set({ list: list })
+    }, [list])
+    const onChangeWayCompany = useCallback((value: string, wayIndex: number) => {
+        setList(pre => {
+            const newList = [...pre]
+            newList[wayIndex].wayCompanyId = value
+            return newList;
+        })
+    }, [])
+
+    const onChangeWayTemplate = useCallback((e: string, wayIndex: number, tempIndex: number) => {
+        setList(pre => {
+            const newList = [...pre]
+            newList[wayIndex].waybillTemplateList[tempIndex] = e;
+            return newList
+        })
+    }, [])
+
+    const onChangePrint = useCallback((e: string, wayIndex: number) => {
+        setList(pre => {
+            const newList = [...pre]
+            newList[wayIndex].printId = e;
+            return newList;
+        })
+    }, [])
+
+    // 新增快递
+    const handleAddWay = useCallback(() => {
+        setList(pre => {
+            const newState = [...pre]
+            newState.push({ wayCompanyId: undefined, waybillTemplateList: [undefined, undefined, undefined], printId: undefined })
+            return newState;
+        })
+    }, [])
+
+    // 删除
+    const remove = useCallback((index: number) => {
+        setList(pre => {
+            const newState = [...pre]
+            newState.splice(index, 1)
+            return newState
+        })
+    }, [])
+
+    return (
+        <>
+            <div className="waybill-model">
+                <span className="waybill-model-title" key="one">选择快递</span>
+                <span className="waybill-model-title" key="two">选择淘系及其他平台订单模板</span>
+                <span className="waybill-model-title" key="three">选择拼多多订单模板</span>
+                <span className="waybill-model-title" key="four">选择京东订单模板</span>
+                <span className="waybill-model-print" key="seven">打印机</span>
+                <span className="waybill-model-title" key="five">操作</span>
+                {
+                    list.map((item, wayIndex) => {
+                        return <>
+                            <Select
+                                showSearch
+                                key={ wayIndex + "wayCompany" }
+                                style={ { width: 150 } }
+                                placeholder="请选择快递"
+                                optionFilterProp="children"
+                                onChange={ (value) => onChangeWayCompany(value, wayIndex) }
+                                value={ item.wayCompanyId }
+                            >
+                                {
+                                    AllWayCompany.map((item, index) => {
+                                        return <Option key={ index } value={ item.value }>{ item.name }</Option>
+                                    })
+                                }
+                            </Select>
+                            {
+                                item.waybillTemplateList.map((item, tempIndex) => {
+                                    return <Select
+                                        key={ tempIndex + "wayTemplate" }
+                                        showSearch
+                                        style={ { width: 150 } }
+                                        placeholder="选择快递模板"
+                                        optionFilterProp="children"
+                                        onChange={ (value) => onChangeWayTemplate(value, wayIndex, tempIndex) }
+                                        value={ item }
+                                    >
+                                        {
+                                            getMap.get(tempIndex)!.map((item, index) => {
+                                                return <Option key={ index } value={ item.value }>{ item.name }</Option>
+                                            })
+                                        }
+                                    </Select>
+                                })
+                            }
+                            <Select
+                                key={ item.printId + 'print' }
+                                showSearch
+                                style={ { width: 150 } }
+                                placeholder="选择打印机"
+                                optionFilterProp="children"
+                                onChange={ (value) => onChangePrint(value, wayIndex) }
+                                value={ item.printId }
+                            >
+                                {
+                                    printList.map((item, index) => {
+                                        return <Option key={ index } value={ item }>{ item }</Option>
+                                    })
+                                }
+                            </Select>
+                            <Button type="default" key={ item.printId + "btn" } style={ { padding: "0 5px" } } onClick={ () => remove(wayIndex) }>删除</Button>
+                        </>
+                    })
+                }
+            </div>
+            <Button type="link" onClick={ handleAddWay }>新增快递</Button>
+        </>
+    )
+}
+
+export default WayBillModel
\ No newline at end of file

src/popup/index.tsx

+import React from "react";
+import ReactDOM from "react-dom";
+import 'antd/dist/antd.css';
+import Popup from "./popup"
+
+ReactDOM.render(<Popup/>,document.getElementById("root"))
\ No newline at end of file

src/popup/popup.scss

+.popup-page{
+    display: flex;
+    flex-direction: column;
+    justify-content: flex-start;
+    align-items: stretch;
+    height:400px;
+    width: 800px;
+    .popup-page-title{
+        padding:10px 0;
+        font-size: 16px;
+        font-weight: 650;
+        text-align: center;
+        border-bottom: 1px solid #ccc;
+    }
+    .waybill-panel{
+        display: flex;
+        flex-direction: column;
+        justify-content: flex-start;
+        align-items: stretch;
+        .waybill-panel-title{
+            margin:10px 0;
+            font-size: 15px;
+            font-weight: 650;
+            margin-left:10px;
+        }
+    
+    }
+}
\ No newline at end of file

src/popup/popup.tsx

+import React from "react";
+import WayBillModel from "./components/WayBillModel";
+import IsAutoEmit from "./components/IsAutoEmit";
+
+import "./popup.scss"
+
+
+const Popup = function () {
+
+    return (
+        <div className="popup-page">
+            <span className="popup-page-title">打单设置</span>
+            <div className="waybill-panel">
+                <span className="waybill-panel-title">电子面单模板</span>
+                <div className="waybill-model-wrap">
+                    <WayBillModel />
+                </div>
+            </div>
+            <div className="waybill-panel">
+
+                <IsAutoEmit />
+            </div>
+        </div>
+    )
+}
+
+export default Popup;
\ No newline at end of file

src/types/index.ts

+// //  快递模板列表下载是否完成
+// export const WaybillTemplateComplete = "waybillTemplateComplete"
+
+// // 让popup获取waybillTemplate
+// export const GetWaybillTemplate = "getWaybillTemplate"
+
+export const StartPrint = "StartPrint"
+
+export const Print = "Print"
\ No newline at end of file

tsconfig.json

+{
+    "typeAcquisition": {
+        "include": [
+            "chrome"
+        ]
+    },
+  "compilerOptions": {
+    /* Visit https://aka.ms/tsconfig.json to read more about this file */
+
+    /* Basic Options */
+    // "incremental": true,                   /* Enable incremental compilation */
+    "target": "es5",                          /* Specify ECMAScript target version: 'ES3' (default), 'ES5', 'ES2015', 'ES2016', 'ES2017', 'ES2018', 'ES2019', 'ES2020', or 'ESNEXT'. */
+    "module": "commonjs",                     /* Specify module code generation: 'none', 'commonjs', 'amd', 'system', 'umd', 'es2015', 'es2020', or 'ESNext'. */
+    // "lib": [],                             /* Specify library files to be included in the compilation. */
+    // "allowJs": true,                       /* Allow javascript files to be compiled. */
+    // "checkJs": true,                       /* Report errors in .js files. */
+    "jsx": "react",                     /* Specify JSX code generation: 'preserve', 'react-native', or 'react'. */
+    // "declaration": true,                   /* Generates corresponding '.d.ts' file. */
+    // "declarationMap": true,                /* Generates a sourcemap for each corresponding '.d.ts' file. */
+    // "sourceMap": true,                     /* Generates corresponding '.map' file. */
+    // "outFile": "./",                       /* Concatenate and emit output to single file. */
+    // "outDir": "./",                        /* Redirect output structure to the directory. */
+    // "rootDir": "./",                       /* Specify the root directory of input files. Use to control the output directory structure with --outDir. */
+    // "composite": true,                     /* Enable project compilation */
+    // "tsBuildInfoFile": "./",               /* Specify file to store incremental compilation information */
+    // "removeComments": true,                /* Do not emit comments to output. */
+    // "noEmit": true,                        /* Do not emit outputs. */
+    // "importHelpers": true,                 /* Import emit helpers from 'tslib'. */
+    "downlevelIteration": true,            /* Provide full support for iterables in 'for-of', spread, and destructuring when targeting 'ES5' or 'ES3'. */
+    // "isolatedModules": true,               /* Transpile each file as a separate module (similar to 'ts.transpileModule'). */
+
+    /* Strict Type-Checking Options */
+    "strict": true,                           /* Enable all strict type-checking options. */
+    // "noImplicitAny": true,                 /* Raise error on expressions and declarations with an implied 'any' type. */
+    // "strictNullChecks": true,              /* Enable strict null checks. */
+    // "strictFunctionTypes": true,           /* Enable strict checking of function types. */
+    // "strictBindCallApply": true,           /* Enable strict 'bind', 'call', and 'apply' methods on functions. */
+    // "strictPropertyInitialization": true,  /* Enable strict checking of property initialization in classes. */
+    // "noImplicitThis": true,                /* Raise error on 'this' expressions with an implied 'any' type. */
+    // "alwaysStrict": true,                  /* Parse in strict mode and emit "use strict" for each source file. */
+
+    /* Additional Checks */
+    // "noUnusedLocals": true,                /* Report errors on unused locals. */
+    // "noUnusedParameters": true,            /* Report errors on unused parameters. */
+    // "noImplicitReturns": true,             /* Report error when not all code paths in function return a value. */
+    // "noFallthroughCasesInSwitch": true,    /* Report errors for fallthrough cases in switch statement. */
+    // "noUncheckedIndexedAccess": true,      /* Include 'undefined' in index signature results */
+
+    /* Module Resolution Options */
+    // "moduleResolution": "node",            /* Specify module resolution strategy: 'node' (Node.js) or 'classic' (TypeScript pre-1.6). */
+    // "baseUrl": "./",                       /* Base directory to resolve non-absolute module names. */
+    // "paths": {},                           /* A series of entries which re-map imports to lookup locations relative to the 'baseUrl'. */
+    // "rootDirs": [],                        /* List of root folders whose combined content represents the structure of the project at runtime. */
+    // "typeRoots": [],                       /* List of folders to include type definitions from. */
+    // "types": [],                           /* Type declaration files to be included in compilation. */
+    // "allowSyntheticDefaultImports": true,  /* Allow default imports from modules with no default export. This does not affect code emit, just typechecking. */
+    "esModuleInterop": true,                  /* Enables emit interoperability between CommonJS and ES Modules via creation of namespace objects for all imports. Implies 'allowSyntheticDefaultImports'. */
+    // "preserveSymlinks": true,              /* Do not resolve the real path of symlinks. */
+    // "allowUmdGlobalAccess": true,          /* Allow accessing UMD globals from modules. */
+
+    /* Source Map Options */
+    // "sourceRoot": "",                      /* Specify the location where debugger should locate TypeScript files instead of source locations. */
+    // "mapRoot": "",                         /* Specify the location where debugger should locate map files instead of generated locations. */
+    // "inlineSourceMap": true,               /* Emit a single file with source maps instead of having a separate file. */
+    // "inlineSources": true,                 /* Emit the source alongside the sourcemaps within a single file; requires '--inlineSourceMap' or '--sourceMap' to be set. */
+
+    /* Experimental Options */
+    // "experimentalDecorators": true,        /* Enables experimental support for ES7 decorators. */
+    // "emitDecoratorMetadata": true,         /* Enables experimental support for emitting type metadata for decorators. */
+
+    /* Advanced Options */
+    "skipLibCheck": true,                     /* Skip type checking of declaration files. */
+    "forceConsistentCasingInFileNames": true  /* Disallow inconsistently-cased references to the same file. */
+  },
+  "include": [
+      "./src/**/*"
+  ]
+}

webpack/webpack.common.js

+const Path = require("path")
+const CopyWebpackPlugin = require("copy-webpack-plugin")
+const HtmlWebpackPlugin = require("html-webpack-plugin")
+const {CleanWebpackPlugin} = require("clean-webpack-plugin")
+
+module.exports = {
+    entry: {
+        background: Path.resolve(__dirname, "../src/background/index.ts"),
+        popup: Path.resolve(__dirname, "../src/popup/index.tsx"),
+        content: Path.resolve(__dirname, "../src/content/index.ts"),
+        
+    },
+    output: {
+        filename: "[name].js",
+        path:Path.resolve(__dirname,"../dist")
+    },
+    resolve: {
+        extensions:[".tsx",".ts",".js"]
+    },
+    module: {
+        rules: [
+            {
+                test: /\.tsx?$/,
+                use:"ts-loader"
+            },
+            {
+                test: /\.scss$/,
+                use: [
+                    "style-loader",
+                    {
+                        loader: "css-loader",
+                        options: {
+                            importLoaders:1
+                        }
+                    },
+                    "sass-loader"
+                ]
+            },
+            {
+                test: /\.css$/,
+                use: [
+                    "style-loader",
+                    "css-loader"
+                ]
+            }
+        ]
+    },
+    plugins: [
+        
+        new HtmlWebpackPlugin({
+            template: Path.resolve(__dirname, "../public/index.html"),
+            chunks: ["popup"],
+            filename:"popup.html"
+        }),
+        new CopyWebpackPlugin({
+            patterns: [
+                {
+                    from: Path.resolve(__dirname, "../manifest.json"),
+                    to: Path.resolve(__dirname, "../dist"),
+                    force:true
+                },
+                {
+                    from: Path.resolve(__dirname, "../assets"),
+                    to: Path.resolve(__dirname, "../dist"),
+                    force:true
+                }
+            ]
+        }),
+        // new CleanWebpackPlugin({
+        //     verbose:true
+        // }),
+
+    ]
+}
\ No newline at end of file

webpack/webpack.dev.js

+const common= require("./webpack.common.js")
+const { merge }=require("webpack-merge")
+
+module.exports = merge(common, {
+    mode: "development",
+    devtool: "cheap-source-map",
+})
\ No newline at end of file

webpack/webpack.prod.js

+const common= require("./webpack.common.js")
+const { merge }=require("webpack-merge")
+
+module.exports = merge(common, {
+    mode: "production",
+})
\ No newline at end of file

新版发货易外放接口.ts

+// ScanPrintingForm对象默认绑定在 window["scan-printing-form"]
+
+// 可以在发货易js加载之前增加事件回调,可以保证获取到ScanPrintingForm对象
+// window.addEventListener("onSEScanPrintingFormLoad", () => {
+//   const scanPrintingForm = window["scan-printing-form"];
+// });
+
+/**
+ * 扫描打印数据加载完成回调函数
+ */
+type OnLoadCallbackFunction = (data: OnLoadData) => void;
+
+/**
+ * 扫描打印数据加载完成回调数据
+ */
+interface OnLoadData {
+  waybillTemplates: WaybillTemplate[];
+
+  shippingAddresses: ShippingAddress[];
+
+  printers: Printer[];
+}
+
+interface ScanPrintingForm {
+  /**
+   * 增加数据加载成功回调方法
+   * 使用示例
+   * ```
+   * scanPrintingForm.onLoad((data)=>{
+   *    const { waybillTemplates, shippingAddresses, printers } = data;
+   *
+   * })
+   * ```
+   */
+  onLoad(callbackFn: OnLoadCallbackFunction): void;
+
+  /**
+   * 配置表单
+   */
+  config(params: ConfigParams): Result;
+
+  /**
+   * 发送扫描打印任务
+   */
+  searchAndPrint(value: string): Result;
+}
+
+interface Result {
+  successful: boolean;
+
+  message: string;
+}
+
+/**
+ * 扫描打印类型
+ */
+enum ScanPrintSearchType {
+  /**
+   * 使用订单编号
+   */
+  ORDER_ORIGINAL_ID = "ORDER_ORIGINAL_ID",
+
+  /**
+   * 使用运单号
+   */
+  WAYBILL_NO = "WAYBILL_NO",
+}
+
+/**
+ * 获取运单号方式
+ */
+enum GetWaybillNoMethod {
+  /**
+   * 使用新单号
+   */
+  NEW = "NEW",
+  /**
+   * 使用旧单号
+   */
+  OLD = "OLD",
+}
+
+/**
+ * 发货方式
+ */
+enum ShippingWay {
+  /**
+   * 自己联系物流
+   */
+  OFFLINE = "OFFLINE",
+  /**
+   * 在线下单
+   */
+  ONLINE = "ONLINE",
+}
+
+/**
+ * 快递单模板打印类型
+ */
+interface ConfigParams {
+  /**
+   * 扫描类型
+   */
+  searchType: ScanPrintSearchType;
+
+  /**
+   * 是否避免重复扫描打印
+   */
+  checkRepeatPrint: boolean;
+
+  /**
+   * 快递单模板id
+   */
+  waybillTemplateId: number;
+
+  /**
+   * 打印机名称
+   */
+  printer: string;
+
+  /**
+   * 发货人id
+   */
+  shippingAddressId: number;
+
+  /**
+   * 是否打印成功后自动发货
+   */
+  autoShippingAfterPrint: boolean;
+
+  /**
+   * 获取面单方式
+   */
+  getWaybillNoMethod: GetWaybillNoMethod;
+
+  /**
+   * 发货方式
+   */
+  shippingWay?: ShippingWay;
+}
+
+/**
+ * 快递单模板的类型
+ */
+enum WaybillTemplateType {
+  CAINIAO = "CAINIAO",
+
+  JD = "JD",
+
+  JDL = "JDL",
+
+  NORMAL = "NORMAL",
+
+  OFFICIAL = "OFFICIAL",
+
+  PDD = "PDD",
+
+  JINRITEMAI = "JINRITEMAI",
+
+  TAOBAO_CAINIAO = "TAOBAO_CAINIAO",
+}
+
+/**
+ * 快递单模板
+ */
+interface WaybillTemplate {
+  allowedShopIds?: string;
+
+  allowedShopIdsArray?: string[];
+
+  bindingPrinter: string;
+
+  bindingShopIds: string;
+
+  companyId: number;
+
+  customAreaHeight?: number;
+
+  customAreaLeft: number;
+
+  customAreaPrintTemplateUrl: string;
+
+  customAreaTop: number;
+
+  customAreaWidth?: number;
+
+  defaultShippingAddressId: number;
+
+  deleted: boolean;
+
+  enableEmptyShortAddressCheck: boolean;
+
+  /**
+   * 只有电子面单才有此字段
+   * 申请地址id
+   */
+  ewaybillShippingAddressId: number;
+
+  forceNoPageMargins: boolean;
+
+  height: number;
+
+  id: number;
+
+  index: number;
+
+  is3PartsWaybill: boolean;
+
+  isPrintBottomLogo: boolean;
+
+  isPrintTopLogo: boolean;
+
+  isSystemTemplate: boolean;
+
+  logisticsCompany: LogisticsCompany;
+
+  name: string;
+
+  offsetLeft: number;
+
+  offsetTop: number;
+
+  picture: string;
+
+  printTemplateId: string;
+
+  printTemplateUrl: string;
+
+  printType: WaybillTemplatePrintType;
+
+  serviceOptions: string;
+
+  shopId: number;
+
+  supportsChildWaybillNoMode: boolean;
+
+  systemTemplateId: number;
+
+  thumbnail: string;
+
+  type: WaybillTemplateType;
+
+  width: number;
+}
+
+/**
+ * 快递单模板打印类型
+ */
+enum WaybillTemplatePrintType {
+  CAINIAO = "CAINIAO",
+
+  JDL = "JDL",
+
+  PDD = "PDD",
+
+  /**蓝牙打印 */
+  PRINT_CMD = "PRINT_CMD",
+
+  JINRITEMAI = "JINRITEMAI",
+}
+
+/**
+ * 快递公司类型
+ */
+enum LogisticsCompany {
+  /**中通快递 */
+  ZTO = "ZTO",
+
+  /**中通快运 */
+  ZTO56 = "ZTO56",
+
+  /**圆通速递 */
+  YTO = "YTO",
+
+  /**申通快递 */
+  STO = "STO",
+
+  /**韵达速递 */
+  YUNDA = "YUNDA",
+
+  /**韵达快运 */
+  YUNDA56 = "YUNDA56",
+
+  /**中国邮政 */
+  POST = "POST",
+
+  /**邮政快递包裹 */
+  POSTB = "POSTB",
+
+  /**邮政标准快递 */
+  POSTS = "POSTS",
+
+  /**EMS */
+  EMS = "EMS",
+
+  /**顺丰速运 */
+  SF = "SF",
+
+  /**顺丰快运 */
+  SFKY = "SFKY",
+
+  /**极兔速递 */
+  JT = "JT",
+
+  /**天天快递 */
+  TTKDEX = "TTKDEX",
+
+  /**宅急送 */
+  ZJS = "ZJS",
+
+  /**百世快递 */
+  HTKY = "HTKY",
+
+  /**百世快运 */
+  BESTQJT = "BESTQJT",
+
+  /**百世物流 */
+  BEST = "BEST",
+
+  /**众邮快递 */
+  ZY = "ZY",
+
+  /**京东快运 */
+  JDKY = "JDKY",
+
+  /**丰网速运 */
+  FENGWANG = "FENGWANG",
+
+  /**安能快递 */
+  ANE66 = "ANE66",
+
+  /**安能物流 */
+  ANE56 = "ANE56",
+
+  /**京东快递 */
+  JD_EXPRESS = "JD_EXPRESS",
+
+  /**京东大件物流 */
+  JD_HPCP = "JD_HPCP",
+
+  /**德邦物流 */
+  DBL = "DBL",
+
+  /**德邦快递 */
+  DBKD = "DBKD",
+
+  /**韵达国际 */
+  YUNDAGJ = "YUNDAGJ",
+
+  /**韵达同城 */
+  YUNDA_TC = "YUNDA_TC",
+
+  /**申通快运 */
+  STO56 = "STO56",
+
+  /**申通国际 */
+  STOGJ = "STOGJ",
+
+  /**中通国际 */
+  ZTOGJ = "ZTOGJ",
+
+  /**国通快递 */
+  GTO = "GTO",
+
+  /**EMS经济快递 */
+  EYB = "EYB",
+
+  /**跨越速运 */
+  KUAYUE = "KUAYUE",
+
+  /**安鲜达 */
+  EXFRESH = "EXFRESH",
+
+  /**九曳供应链 */
+  JIUYESCM = "JIUYESCM",
+
+  /**优速快递 */
+  UC = "UC",
+
+  /**万象物流 */
+  WXWL = "WXWL",
+
+  /**全锋快递 */
+  QFKD = "QFKD",
+
+  /**龙邦快递 */
+  LB = "LB",
+
+  /**全一快递 */
+  UAPEX = "UAPEX",
+
+  /**快捷快递 */
+  FAST = "FAST",
+
+  /**天地华宇 */
+  HOAU = "HOAU",
+
+  /**品骏快递 */
+  PJBEST = "PJBEST",
+
+  /**如风达快递 */
+  RFD = "RFD",
+
+  /**远成快运 */
+  YCKY = "YCKY",
+
+  /**壹米滴答 */
+  YMDD = "YMDD",
+
+  /**速尔快递 */
+  SURE = "SURE",
+
+  /**速通物流 */
+  SUT56 = "SUT56",
+
+  /**中铁快运 */
+  CRE = "CRE",
+
+  /**亚风 */
+  AIR = "AIR",
+
+  /**佳吉快递 */
+  CNEX = "CNEX",
+
+  /**联邦快递 */
+  FEDEX = "FEDEX",
+
+  /**增益速递 */
+  QRT = "QRT",
+
+  /**加运美速递 */
+  JYMWL = "JYMWL",
+
+  /**信丰物流 */
+  XFWL = "XFWL",
+
+  /**大田物流 */
+  DTW = "DTW",
+
+  /**D速物流 */
+  DSWL = "DSWL",
+
+  /**承诺达特快 */
+  CNDTK = "CNDTK",
+
+  /**运通物流 */
+  YTWL = "YTWL",
+
+  /**长宇物流 */
+  CYWL = "CYWL",
+
+  /**新邦物流 */
+  XBWL = "XBWL",
+
+  /**联昊通 */
+  LWT = "LWT",
+
+  /**苏宁物流 */
+  SNWL = "SNWL",
+
+  /**能达速递 */
+  NDSD = "NDSD",
+
+  /**保宏物流 */
+  BHWL = "BHWL",
+
+  /**发网 */
+  FW = "FW",
+
+  /**长发 */
+  CF = "CF",
+
+  /**远长 */
+  YC = "YC",
+
+  /**东方汇 */
+  DFH = "DFH",
+
+  /**飞远配送 */
+  FYPS = "FYPS",
+
+  /**黑猫宅急便 */
+  HMZJB = "HMZJB",
+
+  /**E速宝 */
+  ESB = "ESB",
+
+  /**华强物流 */
+  HQWL = "HQWL",
+
+  /**安迅物流 */
+  AXWL = "AXWL",
+
+  /**中运全速 */
+  TOPSPEED = "TOPSPEED",
+
+  /**华企快运 */
+  HUAQIEX = "HUAQIEX",
+
+  /**丹鸟 */
+  DN = "DN",
+
+  /**都市节奏 */
+  DSJZ = "DSJZ",
+
+  /**宽昊物流 */
+  KHWL = "KHWL",
+
+  /**顺心捷达 */
+  SXJD = "SXJD",
+
+  /**京广速递 */
+  SZKKE = "SZKKE",
+
+  /**韵达点通达 */
+  YUNDA_DTD = "YUNDA_DTD",
+
+  /**百世云配 */
+  BSYP = "BSYP",
+
+  /**运通速运 */
+  WTO = "WTO",
+
+  /**沃埃家 */
+  WOWVIP = "WOWVIP",
+
+  /**菜鸟裹裹 */
+  CN_GUOGUO = "CN_GUOGUO",
+
+  /**淘特物流快递 */
+  TTWLKD = "TTWLKD",
+
+  /**速腾快递 */
+  STE56 = "STE56",
+
+  /**安得物流 */
+  ANDE = "ANDE",
+
+  /**百世国际 */
+  BESTGJ = "BESTGJ",
+
+  /**当当网 */
+  DANGDANG = "DANGDANG",
+
+  /**EWE全球快递 */
+  EWE = "EWE",
+
+  /**丰云配 */
+  FYP = "FYP",
+
+  /**高捷物流 */
+  GJWL = "GJWL",
+
+  /**空港宏远电商物流 */
+  HYWL = "HYWL",
+
+  /**卡行天下快运 */
+  KXTX = "KXTX",
+
+  /**日日顺 */
+  RRS = "RRS",
+
+  /**威盛快递 */
+  WSKD = "WSKD",
+
+  /**威时沛运 */
+  WSPY = "WSPY",
+
+  /**贝海国际速递 */
+  XLOBO = "XLOBO",
+
+  /**中远e环球 */
+  ZYEHQ = "ZYEHQ",
+
+  /**转运四方物流 */
+  ZYSF = "ZYSF",
+
+  /**卓志速运 */
+  ZZSY = "ZZSY",
+
+  /**其他 */
+  OTHER = "OTHER",
+}
+
+/**
+ * 发货人对象
+ */
+interface ShippingAddress {
+  id: number;
+
+  /**绑定的店铺列表 用,分割 */
+  bindingShopIds: string;
+
+  city: string;
+
+  cityCode: number;
+
+  district: string;
+
+  districtCode: number;
+
+  mobile: string;
+
+  /**发货地址名称 */
+  name: string;
+
+  province: string;
+
+  provinceCode: number;
+
+  /**发货人姓名 */
+  shipperName: string;
+
+  street: string;
+
+  telephone: string;
+
+  zipCode: string;
+
+  /**排序 */
+  index: number;
+}
+
+/**
+ * 打印机对象
+ */
+interface Printer {
+  name: string;
+}