0.0.5

Author: cezardasilva

README.md

@@ -3,104 +3,82 @@
 
 VueJS Snippets for Atom
 
-
-
 ## Types
-
 - .text.html.vue
 - .text.js
 
-
 ## Snippets
 
-
 ### Vue Component
-
-prefix: component
-
+prefix: template
 body:
   ```Vue
   <template>
-    //You component contents goes here, only html.
+    <div id='YourComponentName'>
+      <!--You component contents goes here-->
+    </div>
   </template>
-
   <script>
+    export default {
+      name: "YourComponentName",
+      data(){
+        return {
+          //Component Data
+          example: true,
+          foo: "bar"
+        }
+      },
 
-  export default {
-    name: "ComponentName",
-    data(){
-      return {
-        //Component Data
-        example: true,
-        foo: "bar"
-
-
-
-      }
-    },
-
-    created(){
-      //On Component created
-    },
+      created(){
+        //On Component created
+      },
 
-    methods: {
-      functionExample(){
-        //Basic Component method
+      methods: {
+        functionExample(){
+          //Basic Component method
+        }
       }
     }
-  }
   </script>
   ```
 
-## Vue Validator
-
-### Global
-  prefix: validator
+## Vue Router
 
+### Router
+  prefix: router
   body:
   ```javascript
-  Vue.validator("validatorName", function (val) {
-    return true
-  });
-  ```
-
-### Local
+  import Vue from 'vue'
+  import VueRouter from 'vue-router'
 
-  prefix: validators
-
-  body:
+  Vue.use(VueRouter)
 
-  ```javascript
-  [..]
-  validators: {
-    nameOfValidator: function (val) {
-      return true
+  const routes = [
+    {
+      name: "YourRouteName",
+      path: "/",
+      component: YourComponent
     }
-  },
-  [...]
-  ```  
-
-## Vue Router
+  ]
 
-### Map
+  export const router = new VueRouter({
+    routes: routes,
+    scrollBehavior (to, from, savedPosition) {
+      return { x: 0, y: 0 }
+    }
+  })
+  ```
 
-  prefix: map
+## Vue filter
 
+### New Filter
+  prefix: filter
   body:
-
   ```javascript
-  router.map({
-    '/example': {
-      component: Example,
-      subRoutes:{
-        '/subrouter': {
-          component: SubRouter
-        }
-      }
-    }
+  Vue.filter('yourfiltername', (value) => {
+    return true
   })
   ```
-
 ## Vue Resource
 
 ### Get

snippets/vue-components.cson

@@ -1,16 +1,16 @@
 '.text.html.vue, .js':
   'Vue Component':
-    'prefix': 'component'
+    'prefix': 'template'
     'description': 'This snippet generates the basic structure for a Vue JS Component'
     'body': """
-      <template>
-        //You component contents goes here
-      </template>
-
-      <script>
-
+    <template>
+      <div id='YourComponentName'>
+        <!--You component contents goes here-->
+      </div>
+    </template>
+    <script>
       export default {
-      	name: "ComponentName",
+      	name: "YourComponentName",
       	data(){
       		return {
       			//Component Data
@@ -29,41 +29,40 @@
       		}
       	}
       }
-      </script>
-    """
-  'Vue Validator':
-    'prefix': 'validator'
-    'description': 'This snippet generates a validator function to Vue Validator'
-    'body': """
-    Vue.validator("validatorName", function (val) {
-    	return true
-    });
-    """
-  'Vue Validator Local':
-    'prefix': 'validators'
-    'description': 'This snippet generates a local validator function'
-    'body': """
-    validators: {
-      nameOfValidator: function (val) {
-        return true
-      }
-    };
+    </script>
     """
-  'Vue Router Map':
-    'prefix': 'map'
+    'Vue Router':
+    'prefix': 'router'
     'description': 'This snippet generates a Vue Router map function'
     'body': """
-    router.map({
-    	'/example': {
-    		component: Example,
-    		subRoutes:{
-    			'/subrouter': {
-    				component: SubRouter
-    			}
-    		}
+    import Vue from 'vue'
+    import VueRouter from 'vue-router'
+
+    Vue.use(VueRouter)
+
+    const routes = [
+      {
+    		name: "YourRouteName",
+    		path: "/",
+    		component: YourComponent
+    	}
+    ]
+
+    export const router = new VueRouter({
+    	routes: routes,
+    	scrollBehavior (to, from, savedPosition) {
+    		return { x: 0, y: 0 }
     	}
     })
     """
+  'Vue Filter':
+    'prefix': 'filter'
+    'description': ''
+    'body': """
+    Vue.filter('yourfiltername', (value) => {
+    	return true
+    })
+    """
   'Vue HTTP Get':
     'prefix': 'get'
     'description': 'This snippet generates a Vue HTTP Get Request function'