I found that I have never liked to write very complex functions. Most of my works are "small code," in the original sense of the word small.
For example, recently I played around with this thing: ["Small Code" Cross-File Line-by-Line Text Statistics "Python" Computer Network Ice and Water](https://www.wdssmq.com/post/20120901104.html "Small Code" Cross-File Line-by-Line Text Statistics "Python" Computer Network Ice and Water")
And recently, feedly changed its layout again. Although it seems that only the root element #box was changed to #root, it caused the corresponding "GM_script" to be modified as well.
I had previously used rollup.js to create a system for developing "GM_scripts." It allowed multiple JavaScript files to be built and concatenated into a final code. However, it required a separate web service to install it as a browser extension. After modifying and compiling, it needed to be installed again to update, and then the browser page had to be manually refreshed...
["Playing Around" Using rollup.js to Write GM Scripts Computer Network Ice and Water](https://www.wdssmq.com/post/20120627834.html "Playing Around" Using rollup.js to Write GM Scripts Computer Network Ice and Water)
There are actually wheels that come with a built-in web service and support hot updates. For example, vite-plugin-monkey has been applied to some projects. However, I have become accustomed to importing Userscript Header as plain text.
And I don't need to include large chunks of CSS or Vue in my "GM_scripts" myself.
// What you see is what you get.jpg
const gm_banner = `
// ==UserScript==
// @name New Userscript
// @namespace https://www.wdssmq.com/
// @version 0.1
// @author Ice and Water
// @description try to take over the world!
// @license MIT
// @noframes
// @run-at document-end
// @match <$URL$>
// @grant none
// ==/UserScript==
/* jshint esversion: 6 */
/* eslint-disable */
`;
const gm_name = "empty_def";
export { gm_banner, gm_name };
At first, I found the plugins rollup-plugin-dev and rollup-plugin-livereload, but both had cross-origin issues (CORS). "CSP and CORS seem to be two different things, you can learn about them yourself."
The former can be modified to allow cross-origin requests, but the latter is troublesome because it depends on upstream packages.
After all the struggles, I stitched together a wheel myself —
wdssmq/rollup-plugin-monkey: Develop "GM_scripts" using rollup:
[https://github.com/wdssmq/rollup-plugin-monkey](https://github.com/wdssmq/rollup-plugin-monkey "wdssmq/rollup-plugin-monkey: Develop "GM_scripts" using rollup")
The code is currently in the v1 branch.The README is troublesome, there are still some issues with pnpm installation to be resolved Orz.Should I publish it to npm? Git installation is also possible.- So, in order to talk about this part, I wrote an article.
"Small Code" rollup.js Development "GM_scripts" Demonstration_Bilibili:
[https://www.bilibili.com/video/BV1qe4y1d7ZM](https://www.bilibili.com/video/BV1qe4y1d7ZM "Small Code" rollup.js Development "GM_scripts" Demonstration_Bilibili)
Disable Content-Security-Policy:
https://microsoftedge.microsoft.com/addons/detail/disable-contentsecurity/ecmfamimnofkleckfamjbphegacljmbp