Opal, bu tür kaynak hata ayıklamasını kolaylaştırmak için source map support sahiptir. Sourcemaps hakkında ayrıntılara girmeyeceğim, ancak HTML5Rocks, konuyu derinlemesine ele alan bir great article'a sahip. Bize doğrudan kullanmasına izin
class Test
def initialize
end
def crash
print x
end
end
Test.new.crash
Bunun yerine yabancı utilties bir çok kullanmak ister beri:
Let bizim kaynak dosyası index.rb: Burada
Opal o kurmak için asgari demirbaş olan Opal API'sı. Yukarıdaki dosyayı derlemek olacak bir dosya
builder.rb oluşturun:
require 'opal'
Opal::Processor.source_map_enabled = true
Opal.append_path "."
builder = Opal::Builder.new.build('index')
# Write the output file containing a referece to sourcemap
# which we generate below : this will help the browser locate the
# sourcemap. Note that we are generating sourcemap for only code and not
# the entire Opal corelib.
#
File.binwrite "build.js", "#{builder.to_s}\n//# sourceMappingURL=build.js.map"
File.binwrite "build.js.map", builder.source_map.to_s
File.binwrite "opal_lib.js", Opal::Builder.build('opal_lib')
Ayrıca sadece içeren bir
opal_lib.rb dosyası oluşturmak:
require 'opal'
Nihayet bize tarayıcıda komut dosyasını çalıştırmak sağlayacak bir
index.html oluşturun.
ruby builder.rb
Bu derlenmiş üretecektir javascript dosyaları opal_lib.js ve bizim index.html dosyası tarafından başvurulan build.js:
<!DOCTYPE html>
<html>
<head>
<script src="opal_lib.js"></script>
<script src="build.js"></script>
</head>
<body>
</body>
</html>
Şimdi aslında çalıştırın dosyanızı derlemek için. Şimdi tarayıcınızda sadece
index.html'u açın. tarayıcıyı kullanmak üzere
alternatif olarak:
kaynak dosyasının satır numaraları mevcuttur: Tam bir çağrı yığını ve kaynak görünümünü alacak Aynı zamanda Node.js'yi de aynı amaçla kullanabilirsiniz. Bu, Node.js ve npm'un yüklü olmasını gerektirir.Ayrıca Şimdi düğüm Repl açın ve aşağıdaki girebilirsiniz npm modülünü source-map-support
npm install source-map-support
yüklemeniz gerekir:
require('source-map-support').install();
require('./opal_lib');
require('./build');
Alacaksın doğru kaynak hattı numaraları ile bir yığın izleme almak:
/home/gaurav/Workspace/opal-playground/opal_lib.js:4436
Error.captureStackTrace(err);
^
NoMethodError: undefined method `x' for #<Test:0x102>
at OpalClass.$new (/home/gaurav/Workspace/opal-playground/opal_lib.js:4436:15)
at OpalClass.$exception (/home/gaurav/Workspace/opal-playground/opal_lib.js:4454:31)
at $Test.$raise (/home/gaurav/Workspace/opal-playground/opal_lib.js:4204:31)
at $Test.Opal.defn.TMP_1 (/home/gaurav/Workspace/opal-playground/opal_lib.js:3032:19)
at $Test.method_missing_stub [as $x] (/home/gaurav/Workspace/opal-playground/opal_lib.js:886:35)
at $Test.$crash (/home/gaurav/Workspace/opal-playground/index.rb:8:11)
at /home/gaurav/Workspace/opal-playground/index.rb:13:10
at Object.<anonymous> (/home/gaurav/Workspace/opal-playground/index.rb:13:10)
at Module._compile (module.js:435:26)
at Object.Module._extensions..js (module.js:442:10)
sana mücevher yönetimi için bundler kullanmanız önerilir. Diğerleri aynı API altında kullanılmasını belirtmiştik
bundle install
bundle exec ruby builder.rb
dişlisi entegrasyon/raf entegrasyonu, tesisat uzak abstracting: Çalıştırmak zorunda kalacak derlemek için
source 'http://production.cf.rubygems.org'
gem 'opal', github: 'opal/opal'
: İşte Opal ustası alma için Gemfile olduğunu .
Güncelleme: yığınında doğru satır numaralarını sahip olduğundan
, programlama yoluyla yığını ayrıştıracak ve bir değişkene bu satır numarası ayıklamak için oldukça geçerli:
require('./opal_lib');
require('source-map-support').install();
var $e = null;
try {
require('./build');
} catch (e) {
$e = e;
}
var lines = e.split('\n').map(function(line){ return line.match(/^.*\((\S+):(\d+):(\d+)\)/) })
var first_source_line;
for (var i = 0; i < lines.length ; i++) {
var match = lines[i];
if (match == null) continue;
if (match[1].match(/index.rb$/) {
first_source_line = match;
break;
}
}
var line_number;
if (first_source_line) line_number = first_source_line[2] // ==> 8
Ve Tabii ki bunu da yakut yapabilirsiniz (ancak tarayıcıda çalıştırıyorsanız, kaynak-harita-desteğini de buraya eklemelisiniz):
class Test
def initialize
end
def crash
print x
end
end
line_num = nil
begin
Test.new.crash
rescue => e
if line = e.backtrace.map{|line| line.match(/^.*\((\S+):(\d+):(\d+)\)/) }.compact.find{|match| match[1] =~ /index.rb$/ }
line_num = line[2]
end
end
puts "line_num => #{line_num}" # ==> 8
Yanıtın yazarı @ [http://stackoverflow.com/questions/24218609/is-there-a-way-to-show-the-ruby-line-numbers-in-javascript-generated-by- opal] (http://stackoverflow.com/questions/24218609/is-there-a-way-to-show-the-ruby-line-numbers-in-javascript-generated-by-opal) bir güncelleme yayınladı. Muhtemelen bir göz atmalısınız ...;) – juliobetta
@juliobetta evet, okuduğum şey bu. Sprockets veya Rack kullanmam ya da herhangi bir şeyi gerçekten kullanmıyorum. Bunun ne olduğunu bile bilmiyorum. – Voldemort