Javascript 使用带有Tampermonkey的CoffeeScript

Javascript 使用带有Tampermonkey的CoffeeScript,javascript,coffeescript,tampermonkey,Javascript,Coffeescript,Tampermonkey,因为我更喜欢CoffeeScript,所以这是我找到的最好的将其用于Tampermonkey的方法 请参阅下面的答案。步骤1:需要咖啡脚本 在==UserScript==定义中,添加: // @require http://coffeescript.org/extras/coffee-script.js 步骤2:定义evaluator函数并编写CS 源代码使用JS“内联字符串”,然后对其进行编译 完整示例: // ==UserScript== // @name _Coffeescrip

因为我更喜欢CoffeeScript,所以这是我找到的最好的将其用于Tampermonkey的方法

请参阅下面的答案。

步骤1:需要咖啡脚本 在
==UserScript==
定义中,添加:

// @require http://coffeescript.org/extras/coffee-script.js
步骤2:定义evaluator函数并编写CS 源代码使用JS“内联字符串”,然后对其进行编译

完整示例:

// ==UserScript==
// @name     _Coffeescript test
// @include  http://stackoverflow.com/questions/*
// @require  http://coffeescript.org/extras/coffee-script.js
// ==/UserScript==

function evalCS(source) {
  // Compile source to Coffeescript (Array)
  var coffeescript = CoffeeScript.compile(source.toString()).split("\n");

  // Prepend 'debugger'
  coffeescript[1] = "debugger;" + coffeescript[1];

  // Join and eval
  eval(coffeescript.join("\n"));
}

// Script Source
// -------------
evalCS(<><![CDATA[

# CoffeeScript here...
# --------------------
foo = "Foo"
alert foo

]]></>);
/==UserScript==
//@name\u咖啡脚本测试
//@包括http://stackoverflow.com/questions/*
//@需要http://coffeescript.org/extras/coffee-script.js
//==/UserScript==
功能评估(来源){
//将源代码编译为Coffeescript(数组)
var coffeescript=coffeescript.compile(source.toString()).split(“\n”);
//前置“调试器”
coffeescript[1]=“调试器;”+coffeescript[1];
//加入并评估
eval(coffeescript.join(“\n”);
}
//脚本源
// -------------
evalCS();
基于第1步:需要咖啡脚本 在
==UserScript==
定义中,添加:

// @require http://coffeescript.org/extras/coffee-script.js
步骤2:定义evaluator函数并编写CS 源代码使用JS“内联字符串”,然后对其进行编译

完整示例:

// ==UserScript==
// @name     _Coffeescript test
// @include  http://stackoverflow.com/questions/*
// @require  http://coffeescript.org/extras/coffee-script.js
// ==/UserScript==

function evalCS(source) {
  // Compile source to Coffeescript (Array)
  var coffeescript = CoffeeScript.compile(source.toString()).split("\n");

  // Prepend 'debugger'
  coffeescript[1] = "debugger;" + coffeescript[1];

  // Join and eval
  eval(coffeescript.join("\n"));
}

// Script Source
// -------------
evalCS(<><![CDATA[

# CoffeeScript here...
# --------------------
foo = "Foo"
alert foo

]]></>);
/==UserScript==
//@name\u咖啡脚本测试
//@包括http://stackoverflow.com/questions/*
//@需要http://coffeescript.org/extras/coffee-script.js
//==/UserScript==
功能评估(来源){
//将源代码编译为Coffeescript(数组)
var coffeescript=coffeescript.compile(source.toString()).split(“\n”);
//前置“调试器”
coffeescript[1]=“调试器;”+coffeescript[1];
//加入并评估
eval(coffeescript.join(“\n”);
}
//脚本源
// -------------
evalCS();

基于

的原因,我更喜欢将我的咖啡脚本放在一个单独的文件中。正确的语法高亮显示、较少的噪音以及为更大的项目提供单独的模块文件的可能性是该方法的一些优点

所以您有了实际的用户脚本,比如说
main.user.js

// ==UserScript==
// …
// @grant         GM_getResourceText
// @require       http://coffeescript.org/extras/coffee-script.js
// @resource      coffee main.coffee
// ==/UserScript==

eval(CoffeeScript.compile(GM_getResourceText('coffee')));
在它旁边有一个或多个咖啡文件,在本例中是
main.coffee


现在您只需按URI安装用户脚本。我通常只是为此创建一个多文件摘要。如果你不想让脚本放在某个服务器上,你也可以。

我更喜欢将我的咖啡脚本放在一个单独的文件中。正确的语法高亮显示、较少的噪音以及为更大的项目提供单独的模块文件的可能性是该方法的一些优点

所以您有了实际的用户脚本,比如说
main.user.js

// ==UserScript==
// …
// @grant         GM_getResourceText
// @require       http://coffeescript.org/extras/coffee-script.js
// @resource      coffee main.coffee
// ==/UserScript==

eval(CoffeeScript.compile(GM_getResourceText('coffee')));
在它旁边有一个或多个咖啡文件,在本例中是
main.coffee


现在您只需按URI安装用户脚本。我通常只是为此创建一个多文件摘要。如果你不想让脚本放在某个服务器上,你也可以。

重要提示:转到Chrome的扩展页面,检查是否为Tampermonkey启用了“允许访问文件URL”设置

然后在单独的文件中编写CoffeScript代码,并将其作为脚本中的资源引用:

// ==UserScript==
// @name         Tampermonkey CoffeeScript Test
// @namespace    http://your.namespace
// @version      0.1
// @author       your@email.com
// @match        http://*/*
// @grant        GM_getResourceText
// @require      http://coffeescript.org/extras/coffee-script.js
// @resource     coffee file:///home/path/to/script.coffee
// ==/UserScript==

eval(CoffeeScript.compile(GM_getResourceText('coffee')));

重要提示:转到Chrome的扩展页面,检查是否为Tampermonkey启用了“允许访问文件URL”设置

然后在单独的文件中编写CoffeScript代码,并将其作为脚本中的资源引用:

// ==UserScript==
// @name         Tampermonkey CoffeeScript Test
// @namespace    http://your.namespace
// @version      0.1
// @author       your@email.com
// @match        http://*/*
// @grant        GM_getResourceText
// @require      http://coffeescript.org/extras/coffee-script.js
// @resource     coffee file:///home/path/to/script.coffee
// ==/UserScript==

eval(CoffeeScript.compile(GM_getResourceText('coffee')));

具有讽刺意味的是,OP下面的答案之所以有效,是因为Tampermonkey努力模仿Greasemonkey(Firefox)后来弃用并删除的
功能。很有趣!我想不出更好的多行sting方法了。ECMAScript 6支持反勾选。在当前FF工作;还没有镀铬。同时,代码显示了一种在大多数(?所有当前?)浏览器上都能工作的方法。Chrome现在也支持模板字符串。然而,当使用backticks嵌入CoffeeScript时,破坏结构的分配是由Tampermonkey预先编译的,因此导致编译失败。具有讽刺意味的是,下面OP的答案只起作用,因为Tampermonkey努力模仿Greasemonkey(Firefox)自那以后不推荐和删除的
功能。有趣!我想不出更好的多行sting方法了。ECMAScript 6支持反勾选。在当前FF工作;还没有镀铬。同时,代码显示了一种在大多数(?所有当前?)浏览器上都能工作的方法。Chrome现在也支持模板字符串。但是,当使用backticks嵌入CoffeeScript时,解构赋值是由Tampermonkey预先编译的,因此会导致编译失败。