This package provides the following services:
Polymer Autocomplete Package
Polymer element tag and attribute autocompletions in Atom.
🎥 Preview video of autocomplete-polymer in action
Package Installation
From the Atom editor menus, navigate to Atom -> Preferences
.
Click on the install tab and enter autocomplete-polymer
in the search field.
Usage guide
For the package to offer autocompletion hints it needs to have a list of the possible elements
in your current project. This is saved within a file in your projects root directory named .ac-poly.json
. This file needs to built for each polymer project and updated when elements are changed or added (including bower components). It is recommended that the file is added to your .gitignore
.
Whenever you need to build / update the autocompletion dictionary (.ac-poly.json
) then run the Update Project Completions Dictionary
command in the autocomplete-polymer package menu (Packages -> Autocomplete Polymer
) in the top toolbar.
You can also call Autocomplete Polymer:Update
from the command palette (cmd + shift + p
) or use the keyboard shortcut ctrl + alt + p
.
How it works
The package builds a list of autocompletions by:
- Scanning your projects directory for all
js
andhtml
files that are not within a folder namedtest
ordemo
. - then it searches through those files for the Polymer element registration calls (
Polymer({ is: '...'})
). - The identified scripts containing the Polymer calls are then parsed and analysed by
esprima
such that we can pull out the elements names and a list of it's properties. - A JSON object is written to the projects root folder which contains all the element names and the properties associated with those elements.
Important Notes
- Probably not compatible with atom projects which have multiple root folders.
- Will ignore any files placed within a
test
ordemo
folder. - Only scans
js
andhtml
files. - Required to run the update command whenever there is a need to refresh the completions dictionary.
Recommended Packages for Atom
- For Polymer snippets check out: atom-polymer
- Html autocompletions: autocomplete-html
- Automatic closing of html tags: autoclose-html
- File path autocompletions: autocomplete-paths
- Html code linter: linter-htmlhint
Acknowledgements
This project is a fork of the autocomplete-html project. The project makes use of scandal for directory scanning and file searching, esprima for the javascript analysis and estraverse for the transversal of the abstract syntax tree.
Bugs, Improvements, Requests
Please add an issue in the GitHub repository if you find any bugs, have improvement ideas, or requests.
Contributing
Any pull requests will be greatly welcome since I'm sure there is plenty of room for improvement.
Author
Mark Silverwood