chrome-extension-tools
chrome-extension-tools copied to clipboard
jquery in content_scripts load
Build tool
Vite
Where do you see the problem?
- [X] In the browser
- [ ] In the terminal
Describe the bug
"content_scripts": [ { "js": [ "src/lib/jquery-3.3.1.min", "src/index.js" ], "matches": [ "://.baidu.com/*" ] } ]
The dev environment can use $, but the build dist cannot.
Reproduction
Error in event handler: ReferenceError: $ is not defined at e (chrome-extension://omedgkhbnladahaodjdiojnbmiablmip/assets/index.js.561d4845.js:1:104)
test demo https://github.com/yuxinyu12345/crxjs-demo
Logs
No response
System Info
"dependencies": {
"vue": "^3.2.37"
},
"devDependencies": {
"@crxjs/vite-plugin": "^1.0.14",
"@vitejs/plugin-vue": "^3.0.3",
"typescript": "^4.6.4",
"vite": "^3.0.7",
"vue-tsc": "^0.39.5"
}
Severity
blocking an upgrade
i solved the problem. use not import $ from 'jquery',because i use local files. The solution is as follows:
- execute
yarn add jquery - vite.config-build-minify: false, close minify
Vite/CRXJS only support ES modules currently, but support for plain script files like JQuery is on the roadmap.
Vite/CRXJS only support ES modules currently, but support for plain script files like JQuery is on the roadmap.
Thank you for your reply