production build won't work next time

[pro-wh]

we've just barely crossed over a threshold where a chunking rule (which it turned out we had in our webpack config) will start working. we don't load the resulting "common.js" file, so things will be broken.

ideas:

• add common.js to places
• disable that chunk splitting rule
• ship a dev build 😆

[lukaw3d]

I can't reproduce

• Checked out master 09a81f6
• yarn
• yarn buildProd
• Load into Chrome
• Open popup
• Check console for errors. No errors.

[pro-wh]

😱 did the i18n changes put us back under the limit?

[pro-wh]

oh right I forgot to mention that our partners and I were trying @oasisprotoco/client 0.1.0-alpha6

[pro-wh]

oh and additional info: I heard from bitcat that the rule is there because chrome will not load a file larger than 4 MB, so "disable that rule" is out

[lukaw3d]

Whaat. Need proof

Unless all popups are ads https://blog.chromium.org/2020/05/resource-heavy-ads-in-chrome.html

[lvshaoping007]

split is used for firefox . this is detail
mozilla/addons#662

[lvshaoping007]

i add a file to fix after package .

[pro-wh]

@lvshaoping007 could you open a PR with that fix?

I'll read up on these webpack flags and see if I can fix it too, but it'd be convenient if you already have it fixed.

[pro-wh]

Let's go with #171.

An alternative, if we later need it, here's a script from shaoping that programmatically adds the common.js:

pkgBuild.js

var fs = require('fs');

const FILE_NAME = "common.js"
const EDIT_TYPE = {
    "DELETE": "DELETE",
    "ADD": "ADD"
}

let pathCommon = './dist/' + FILE_NAME;
let pathManifest = './dist/manifest.json';
let pathPopup = './dist/popup.html';


fs.readFile(pathCommon, function (err, data) {
    if (err) {
        checkManifest(EDIT_TYPE.DELETE)
        checkPopupHtml(EDIT_TYPE.DELETE)
    } else {
        checkManifest(EDIT_TYPE.ADD)
        checkPopupHtml(EDIT_TYPE.ADD)
    }
})

function checkPopupHtml(editType) {
    fs.readFile(pathPopup, function (err, data) {
        if(err){
            throw new Error("read popup.html failed , please check")
        }else{
            let scriptStr = data.toString();
            let fileIndex = scriptStr.indexOf(FILE_NAME)

            const START_STR = "<script"
            const END_STR = "</script>"
            const INSERT_STR = `<script src="./common.js"></script>\n`
            let scriptStartIndex = scriptStr.indexOf(START_STR)
            if (editType === EDIT_TYPE.ADD && fileIndex === -1) {
                let newStr = scriptStr.slice(0, scriptStartIndex) + INSERT_STR + scriptStr.slice(scriptStartIndex);
                updateFile(pathPopup, newStr)
            } else if (editType === EDIT_TYPE.DELETE && fileIndex !== -1) {
                let scriptEndIndex =  scriptStr.indexOf(END_STR,fileIndex) 
                let targetStr = scriptStr.slice(scriptStartIndex, scriptEndIndex+END_STR.length)
                let newStr = scriptStr.replace(targetStr,"")
                updateFile(pathPopup, newStr)
            }
        }
    })
}
function checkManifest(editType) {
    fs.readFile(pathManifest, function (err, data) {
        if (err) {
            throw new Error("read manifest.json failed , please check")
        } else {
            try {
                let scriptStr = data.toString();
                let scriptJson = JSON.parse(scriptStr)
                let scripts = scriptJson.background.scripts
                let fileIndex = scripts.indexOf(FILE_NAME)

                if (editType === EDIT_TYPE.ADD && fileIndex === -1) { 
                    scriptJson.background.scripts = [...scripts, FILE_NAME]
                    updateFile(pathManifest, JSON.stringify(scriptJson, "", "\t"))
                } else if (editType === EDIT_TYPE.DELETE && fileIndex !== -1) {
                    scripts.splice(fileIndex, 1);
                    scriptJson.background.scripts = scripts
                    updateFile(pathManifest, JSON.stringify(scriptJson, "", "\t"))
                }
            } catch (error) {
                console.log('checkManifest==error', error)
            }
        }
    })
}


function updateFile(path, data) {
    fs.writeFile(path, data, function (err) {
        if (err) {
            console.log(path + "update failed")
        } else {
            console.log(path + "update success");
        }
    })
}