Atom Editor: multiple snippets

Question

This is such a simple question but I can't find any documentation besides the readme.

How can I have multiple custom snippets in Atom Editior:

For example I have this in my snippets.cson right now

'.source.js':
  'Normal Comment Block':
    'prefix': 'cmm'
    'body': """
      //**********************************************************************************
      //
      //**********************************************************************************
    """

'.source.js':
  'Dashed Comment Block':
    'prefix': 'c--'
    'body': """
      //----------------------------------------------------------------------------------
      //
      //----------------------------------------------------------------------------------
    """

But cmm doesn't work, I can only use the last item in the snippets.cson. Any ideas on how to fix this? I have about a dozen different snippets I'd like to use but I cannot figure out how to include them properly.

Answer 1

The configuration file format is called CSON, CoffeeScript Object Notation. Like JSON (JavaScript Object Notation) it is a text format for describing simple objects. Because of which, when you specify a key twice, like .source.js in your example, the second instance overwrites the first. If you simply have one .source.js everything will work fine:

'.source.js':
  'Normal Comment Block':
    'prefix': 'cmm'
    'body': """
      //**********************************************************************************
      // $1
      //**********************************************************************************
      $0
    """
  'Dashed Comment Block':
    'prefix': 'c--'
    'body': """
      //----------------------------------------------------------------------------------
      // $1
      //----------------------------------------------------------------------------------
      $0
    """

Additionally, I took the liberty of adding tab stops to your snippets so that when you expand the snippet, your cursor should land first inside the comment. You can enter your comment and then press TAB to exit out and continue on.

Answer 2

In addition to @Lee's explanation, here's an example if you wan't to setup multiple snippets organized by programming language:

# HTML Snippets
'.text.html':
  'HTML Comment':
    'prefix': '<!'
    'body': '<!-- $1 -->'

# Sass Snippets
'.source.scss':
  'Section Comment':
    'prefix': 'sc'
    'body': """
      /*=================================================
      $1
      =================================================== */
    """
  'Sub Section Comment':
    'prefix': 'ssc'
    'body': """
      /* $1
      =================================================== */
     """

# JavaScript Snippets
'.source.js':
  'jQuery - Bind Event':
    'prefix': 'bind'
    'body': """
       $( $1 ).on( '$2', '$3', function( $4 ) {
         $5
       });
    """

On this example I included HTML, Sass and Javascript but you could include others like CSS, ...

Hope this was usefull.