3

新しい Web プロジェクトを開始しています。構成の最後の部分は、CoffeeScripts ファイルのデバッグを有効にすることです。

プロジェクト全体は、コーヒーを js にコンパイルして適切なマップ ファイルを生成する Grunt タスクを使用してビルドされていますが、IntelliJ で Coffeescript のデバッグ作業を行うことはできません。

IntelliJ File Watcher を使用したくないことに注意してください。

ここに私の Gruntfile があります:

module.exports = (grunt) ->
  grunt.initConfig
    pkg: grunt.file.readJSON('package.json')
    coffee:
      options:
        sourceMap: true
      files:
        expand: true
        flatten: true
        cwd: 'src/'
        src: ['**/*.coffee']
        dest: 'src/'
        ext: '.js'
    concat:
      option:
        separator: ';'
      dist:
        src: ['src/**/*.js']
        dest: 'dist/<%= pkg.name%>.js'
    uglify:
      options:
        banner: '/*! <%= pkg.name %> v<%= pkg.version%> by Pierre Degand <%= grunt.template.today("dd-mm-yyyy") %> */\n'
      dist:
        files:
          'lib/<%= pkg.name%>.min.js': ['<%= concat.dist.dest %>']
    watch:
      files: ['<%= coffee.files.src %>']
      tasks: ['coffee', 'concat', 'uglify']

  grunt.loadNpmTasks('grunt-contrib-concat')
  grunt.loadNpmTasks('grunt-contrib-uglify')
  grunt.loadNpmTasks('grunt-contrib-coffee')
  grunt.loadNpmTasks('grunt-contrib-watch')

  grunt.registerTask('default', ['coffee', 'concat', 'uglify'])

私のシンプルなCoffeeScriptファイル(ブレークポイントはIntelliJの2行目にあります):

name = 'Pierre'
console.log "Hello #{name} !"

Grunt から生成された JS ファイル:

(function() {
  var name;

  name = 'Pierre';

  console.log("Hello " + name + " !!");

}).call(this);

/*
//@ sourceMappingURL=app.js.map
*/

ソースマップ

{
  "version": 3,
  "file": "app.js",
  "sourceRoot": "",
  "sources": [
    "app.coffee"
  ],
  "names": [],
  "mappings": "AAAA;CAAA,GAAA,EAAA;;CAAA,CAAA,CAAO,CAAP,IAAA;;CAAA,CACA,CAAA,CAAa,CAAb,EAAO,CAAM;CADb"
}

最後に、テストに使用する html

<!DOCTYPE html>
<html>
<head>
    <title></title>
</head>
<body>

<script type="text/javascript" src="src/app.js"></script>
</body>
</html>

File watchers を使用したとき、.js と .map.js は .coffee ファイルのサブファイルでした。File Watchers を使用せずに同じ動作を実現できますか?

IntelliJ で「debug index.html」を右クリックすると、「Hello Pierre!!」と表示されます。私のIntelliJデバッガーコンソールでは、スクリプトは壊れていませんconsole.log()

誰かが同じトラブルを抱えていましたか?

ありがとう!

4

1 に答える 1