README.md

VSCode Completion for A-Frame

This extension adds completions for the A-Frame primitives and their attributes.

Primitive Completion

Type a or a- to start the completion and get a list of all primitives (a-box, a-entity, a-sky, etc.).

Attribute Completion

Inside a primitive tag you get an overview and completion of all corresponding attributes (color, position, scale, etc.).

Snippets

Type AFRAME.registerComponent to insert:

AFRAME.registerComponent('component-name', {
	schema: {
		
	},

	init: function () {
	  // Do something when component first attached.
	},

	update: function () {
	  // Do something when component's data is updated.
	},

	remove: function () {
	  // Do something the component or its entity is detached.
	},

	tick: function (time, timeDelta) {
	  // Do something on every scene tick or frame.
	}
});

Type a-scene:example to insert a basic A-Frame scene:

<a-scene background="color: #FAFAFA">
	<a-box position="-1 0.5 -3" rotation="0 45 0" color="#4CC3D9" shadow></a-box>
	<a-sphere position="0 1.25 -5" radius="1.25" color="#EF2D5E" shadow></a-sphere>
	<a-cylinder position="1 0.75 -3" radius="0.5" height="1.5" color="#FFC65D" shadow></a-cylinder>
	<a-plane position="0 0 -4" rotation="-90 0 0" width="4" height="4" color="#7BC8A4" shadow></a-plane>
</a-scene>