{"repo":"JSREI/userscript-template","free":true,"listed":false,"github":"https://github.com/JSREI/userscript-template","clone":"git clone https://github.com/JSREI/userscript-template.git","description":"使用Node.js+Webpack模块化开发油猴脚本的方案，用于提升油猴开发体验，一个JavaScript文件几千行来回翻本人真的有点顶不住......","language":"HTML","stars":20,"topics":["greasemonkey","nodejs","userscript","webpack","template","quickstart"],"license":"MIT","category":"saas-starters-boilerplates","readme_excerpt":"UserScript Template 简体中文 English 官网链接： https://jsrei.github.io/userscript-template/#usage 一、这是什么 使用 Node.js + Webpack 模块化开发油猴脚本的方案，用于提升油猴开发体验，降低开发时的心智负担，让油猴脚本也能当做一个普通的模块化的前端项目来开发，要不然一个 JavaScript 文件几千行来回改本人真的有点顶不住...... 二、优势 - 模块化开发油猴项目，开发体验与效率都能够得到大幅提升，再也不需要头疼怎么在单个 JavaScript 文件中组织代码了（油猴商店上架的脚本得是单文件无混淆无压缩，模块化开发打包出来的JS也是符合上架要求的） - 开发时热加载提高开发效率，采用推荐的开发模式，油猴中指向打包结果本地文件地址， JavaScript 代码有变化时自动编译打包加载，开发时修改代码测试更高效（写过油猴脚本的应该都有过这种糟糕的体验，来来回回修改代码测试非常花费时间简直要了老命） - 发布时打包后的为高可读性的单 JavaScript 文件，符合油猴商店的上架政策，打包出来就能上架不再需要什么手工处理的工作，简单方便不麻烦 三、快速开始 方式一：使用npm命令创建（推荐） 使用npm命令直接创建新项目： 或者使用npx： 然后进入项目目录并安装依赖： 方式二：从GitHub模板创建 在当前仓库（https://github.com/JSREI/userscript-template）选择“ Use this template ” -- “ Create a new repository ”，从这个模板仓库创建一个新的仓库： 选择新仓库存放的位置以及设置仓库名字等等，通常把新仓库挂在自己的账号下边即可： 新仓库创建好了克隆到本地，然后在克隆到的项目根目录下执行命令安装项目所需依赖： 安装依赖可能会花点时间，稍微耐心等待一会儿： 如果依赖安装过慢或者下载不下来，可以为 npm 配置国内镜像源或者使用 cnpm （自行谷歌）。 然后修改 package.json 文件，把相关字段替换为你自己的，比如名字、作者、仓库地址等等： 在项目根目录下的 userscript-headers.js 文件中存放的是默认的油猴头文件，在 webpack 编译的时候会把这个文件放到编译后的文件的头部作为油猴的插件声明： ${name} 、 ${version} 这种是本油猴脚手架支持的一些变量，原理就是在编译的时候会从 package.json 中获取对应的值把变量替换掉（这就是所谓的变量渲染），这样对于这些可能会重复或者一直变的内容我们就可以从一个源引用使用而不用重复设置或者反复修改了，如果默认的配置不能满足你的要求，你可以直接修改这个头文件，比如为其增加权限： 除了变量替换其他内容都会被原样保留，这是编译后的样子： Banner支持 项目支持在编译后的代码中添加自定义banner。在项目根目录的 banner.txt 文件中，你可以添加ASCII艺术字或其他装饰性文本： 编译时，banner内容会被自动插入到油猴脚本头部注释中，支持以下变量替换： - ${name} - 项目名称 - ${version} - 版本号 - ${description} - 项目描述 - ${author} - 作者信息 - ${repository} - 仓库地址 - ${namespace} - 命名空间 - ${document} - 文档地址 编译后的效果： ","default_branch":null,"files":null,"tree":[],"storefront":"/r/JSREI","claimed":false,"request_supported":{"post":"https://gitbuyer.com/r/JSREI/userscript-template/request-supported","requests":0},"note":"indexed from public GitHub; nothing is for sale on this page. Clone it from GitHub. Paid listings live at /search."}