├── art ├── file-icon.png ├── snippets.png ├── html-intellisense.png ├── html-intellisense-partial.png ├── html-intellisense-component.png └── html-intellisense-directives.png ├── src ├── Resources │ ├── icon.png │ ├── Preview.png │ └── VueFile.png ├── source.extension.ico ├── JavaScript │ └── Snippets │ │ ├── snippets.pkgdef │ │ └── VuePack │ │ ├── vue.snippet │ │ ├── vuef.snippet │ │ └── vued.snippet ├── registry.pkgdef ├── Images.imagemanifest.cs ├── Properties │ └── AssemblyInfo.cs ├── HTML │ ├── ContentType │ │ └── VueContentTypeDefinition.cs │ ├── Completion │ │ ├── ElementCompletion.cs │ │ ├── ElementDirectiveCompletion.cs │ │ ├── AttributeDirectiveCompletion.cs │ │ ├── BaseCompletion.cs │ │ └── AttributeCompletion.cs │ ├── VueCreationListener.cs │ └── DirectivesCache.cs ├── source.extension.cs ├── Images.imagemanifest ├── VSPackage.cs ├── Helpers │ └── ProjectHelpers.cs ├── source.extension.vsixmanifest ├── packages.config ├── source.extension.resx └── VuePack.csproj ├── lib ├── Microsoft.Html.Core.dll ├── Microsoft.Web.Editor.dll └── Microsoft.Html.Editor.dll ├── .gitignore ├── ISSUE_TEMPLATE.md ├── CHANGELOG.md ├── .gitattributes ├── LICENSE ├── appveyor.yml ├── VuePack2017.sln ├── README.md └── CONTRIBUTING.md /art/file-icon.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/madskristensen/VuePack2017/HEAD/art/file-icon.png -------------------------------------------------------------------------------- /art/snippets.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/madskristensen/VuePack2017/HEAD/art/snippets.png -------------------------------------------------------------------------------- /src/Resources/icon.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/madskristensen/VuePack2017/HEAD/src/Resources/icon.png -------------------------------------------------------------------------------- /art/html-intellisense.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/madskristensen/VuePack2017/HEAD/art/html-intellisense.png -------------------------------------------------------------------------------- /src/Resources/Preview.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/madskristensen/VuePack2017/HEAD/src/Resources/Preview.png -------------------------------------------------------------------------------- /src/Resources/VueFile.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/madskristensen/VuePack2017/HEAD/src/Resources/VueFile.png -------------------------------------------------------------------------------- /src/source.extension.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/madskristensen/VuePack2017/HEAD/src/source.extension.ico -------------------------------------------------------------------------------- /lib/Microsoft.Html.Core.dll: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/madskristensen/VuePack2017/HEAD/lib/Microsoft.Html.Core.dll -------------------------------------------------------------------------------- /lib/Microsoft.Web.Editor.dll: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/madskristensen/VuePack2017/HEAD/lib/Microsoft.Web.Editor.dll -------------------------------------------------------------------------------- /lib/Microsoft.Html.Editor.dll: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/madskristensen/VuePack2017/HEAD/lib/Microsoft.Html.Editor.dll -------------------------------------------------------------------------------- /art/html-intellisense-partial.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/madskristensen/VuePack2017/HEAD/art/html-intellisense-partial.png -------------------------------------------------------------------------------- /art/html-intellisense-component.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/madskristensen/VuePack2017/HEAD/art/html-intellisense-component.png -------------------------------------------------------------------------------- /art/html-intellisense-directives.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/madskristensen/VuePack2017/HEAD/art/html-intellisense-directives.png -------------------------------------------------------------------------------- /src/JavaScript/Snippets/snippets.pkgdef: -------------------------------------------------------------------------------- 1 | 2 | [$RootKey$\Languages\CodeExpansions\JavaScript\Paths] 3 | "VuePack"="$PackageFolder$\VuePack" -------------------------------------------------------------------------------- /src/registry.pkgdef: -------------------------------------------------------------------------------- 1 | [$RootKey$\ShellFileAssociations\.vue] 2 | "DefaultIconMoniker"="af265e71-5e4f-43f6-9d14-8b198b7e74f2:0" 3 | 4 | [$RootKey$\Languages\File Extensions\.vue] 5 | @="{9bbfd173-9770-47dc-b191-651b7ff493cd}" 6 | 7 | [$RootKey$\Editors\{40d31677-cbc0-4297-a9ef-89d907823a98}\Extensions] 8 | "vue"=dword:32 -------------------------------------------------------------------------------- /.gitignore: -------------------------------------------------------------------------------- 1 | packages 2 | 3 | # User files 4 | *.suo 5 | *.user 6 | *.sln.docstates 7 | .vs/ 8 | 9 | # Build results 10 | [Dd]ebug/ 11 | [Rr]elease/ 12 | x64/ 13 | [Bb]in/ 14 | [Oo]bj/ 15 | 16 | # MSTest test Results 17 | [Tt]est[Rr]esult*/ 18 | [Bb]uild[Ll]og.* 19 | 20 | # NCrunch 21 | *.ncrunchsolution 22 | *.ncrunchproject 23 | _NCrunch_WebCompiler -------------------------------------------------------------------------------- /src/Images.imagemanifest.cs: -------------------------------------------------------------------------------- 1 | using System; 2 | using Microsoft.VisualStudio.Imaging.Interop; 3 | 4 | namespace VuePack 5 | { 6 | public static class Images 7 | { 8 | private static Guid _guid = new Guid("{af265e71-5e4f-43f6-9d14-8b198b7e74f2}"); 9 | 10 | public static ImageMoniker VueFile { get { return new ImageMoniker { Guid = _guid, Id = 0 }; } } 11 | } 12 | } 13 | -------------------------------------------------------------------------------- /ISSUE_TEMPLATE.md: -------------------------------------------------------------------------------- 1 | ### Installed product versions 2 | - Visual Studio: [example 2015 Professional] 3 | - This extension: [example 1.1.21] 4 | 5 | ### Description 6 | Replace this text with a short description 7 | 8 | ### Steps to recreate 9 | 1. Replace this 10 | 2. text with 11 | 3. the steps 12 | 4. to recreate 13 | 14 | ### Current behavior 15 | Explain what it's doing and why it's wrong 16 | 17 | ### Expected behavior 18 | Explain what it should be doing after it's fixed. -------------------------------------------------------------------------------- /CHANGELOG.md: -------------------------------------------------------------------------------- 1 | # Roadmap 2 | 3 | - [ ] Item templates 4 | 5 | Features that have a checkmark are complete and available for 6 | download in the 7 | [CI build](http://vsixgallery.com/extension/4163aa08-9878-4b1c-a1ee-58ab67f7db5b/). 8 | 9 | # Changelog 10 | 11 | These are the changes to each version that has been released 12 | on the official Visual Studio extension gallery. 13 | 14 | ## 1.1 15 | - [x] Support for JavaScript formatting in .vue files 16 | 17 | ## 1.0 18 | 19 | - [x] Initial release -------------------------------------------------------------------------------- /.gitattributes: -------------------------------------------------------------------------------- 1 | # Auto detect text files and perform LF normalization 2 | * text=auto 3 | 4 | # Custom for Visual Studio 5 | *.cs diff=csharp 6 | *.sln merge=union 7 | *.csproj merge=union 8 | *.vbproj merge=union 9 | *.fsproj merge=union 10 | *.dbproj merge=union 11 | 12 | # Standard to msysgit 13 | *.doc diff=astextplain 14 | *.DOC diff=astextplain 15 | *.docx diff=astextplain 16 | *.DOCX diff=astextplain 17 | *.dot diff=astextplain 18 | *.DOT diff=astextplain 19 | *.pdf diff=astextplain 20 | *.PDF diff=astextplain 21 | *.rtf diff=astextplain 22 | *.RTF diff=astextplain 23 | -------------------------------------------------------------------------------- /LICENSE: -------------------------------------------------------------------------------- 1 | Copyright 2016 Mads Kristensen 2 | 3 | Licensed under the Apache License, Version 2.0 (the "License"); 4 | you may not use this file except in compliance with the License. 5 | You may obtain a copy of the License at 6 | 7 | http://www.apache.org/licenses/LICENSE-2.0 8 | 9 | Unless required by applicable law or agreed to in writing, software 10 | distributed under the License is distributed on an "AS IS" BASIS, 11 | WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. 12 | See the License for the specific language governing permissions and 13 | limitations under the License. -------------------------------------------------------------------------------- /src/Properties/AssemblyInfo.cs: -------------------------------------------------------------------------------- 1 | using System.Reflection; 2 | using System.Runtime.InteropServices; 3 | using VuePack; 4 | 5 | [assembly: AssemblyTitle(Vsix.Name)] 6 | [assembly: AssemblyDescription(Vsix.Description)] 7 | [assembly: AssemblyConfiguration("")] 8 | [assembly: AssemblyCompany(Vsix.Author)] 9 | [assembly: AssemblyProduct(Vsix.Name)] 10 | [assembly: AssemblyCopyright(Vsix.Author)] 11 | [assembly: AssemblyTrademark("")] 12 | [assembly: AssemblyCulture("")] 13 | 14 | [assembly: ComVisible(false)] 15 | 16 | [assembly: AssemblyVersion(Vsix.Version)] 17 | [assembly: AssemblyFileVersion(Vsix.Version)] 18 | -------------------------------------------------------------------------------- /src/HTML/ContentType/VueContentTypeDefinition.cs: -------------------------------------------------------------------------------- 1 | using System.ComponentModel.Composition; 2 | using Microsoft.VisualStudio.Utilities; 3 | 4 | namespace VuePack 5 | { 6 | public class VueContentTypeDefinition 7 | { 8 | public const string VueContentType = "htmlx"; 9 | private const string VueFileExtension = ".vue"; 10 | 11 | [Export(typeof(FileExtensionToContentTypeDefinition))] 12 | [ContentType(VueContentType)] 13 | [FileExtension(VueFileExtension)] 14 | public FileExtensionToContentTypeDefinition VueFileExtensionDefinition { get; set; } 15 | } 16 | } 17 | -------------------------------------------------------------------------------- /appveyor.yml: -------------------------------------------------------------------------------- 1 | image: Visual Studio 2017 2 | 3 | install: 4 | - ps: (new-object Net.WebClient).DownloadString("https://raw.github.com/madskristensen/ExtensionScripts/master/AppVeyor/vsix.ps1") | iex 5 | 6 | before_build: 7 | - ps: Vsix-IncrementVsixVersion | Vsix-UpdateBuildVersion 8 | - ps: Vsix-TokenReplacement src\source.extension.cs 'Version = "([0-9\\.]+)"' 'Version = "{version}"' 9 | 10 | build_script: 11 | - nuget restore -Verbosity quiet 12 | - msbuild /p:configuration=Release /p:DeployExtension=false /p:ZipPackageCompressionLevel=normal /v:m 13 | 14 | after_test: 15 | - ps: Vsix-PushArtifacts | Vsix-PublishToGallery -------------------------------------------------------------------------------- /src/JavaScript/Snippets/VuePack/vue.snippet: -------------------------------------------------------------------------------- 1 | 2 |
3 | vue 4 | vue 5 | vue instance 6 | Mads Kristensen 7 | 8 | Expansion 9 | 10 |
11 | 12 | 13 | 14 | selector 15 | #app 16 | 17 | 18 | 19 | 24 | 25 | 26 | -------------------------------------------------------------------------------- /src/JavaScript/Snippets/VuePack/vuef.snippet: -------------------------------------------------------------------------------- 1 | 2 |
3 | vuef 4 | vuef 5 | vue filter 6 | Mads Kristensen 7 | 8 | Expansion 9 | 10 |
11 | 12 | 13 | 14 | name 15 | my-filter 16 | 17 | 18 | 19 | 24 | 25 | 26 | -------------------------------------------------------------------------------- /src/source.extension.cs: -------------------------------------------------------------------------------- 1 | // ------------------------------------------------------------------------------ 2 | // 3 | // This file was generated by Extensibility Tools v1.10.188 4 | // 5 | // ------------------------------------------------------------------------------ 6 | namespace VuePack 7 | { 8 | static class Vsix 9 | { 10 | public const string Id = "4163aa08-9878-4b1c-a1ee-58ab67f7db5b"; 11 | public const string Name = "Vue.js Pack 2017"; 12 | public const string Description = @"Contains HTML Intellisense and code snippets for the Vue.js JavaScript library"; 13 | public const string Language = "en-US"; 14 | public const string Version = "1.1"; 15 | public const string Author = "Mads Kristensen"; 16 | public const string Tags = "vue.js, snippets, javascript"; 17 | } 18 | } 19 | -------------------------------------------------------------------------------- /src/Images.imagemanifest: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 | -------------------------------------------------------------------------------- /src/JavaScript/Snippets/VuePack/vued.snippet: -------------------------------------------------------------------------------- 1 | 2 |
3 | vued 4 | vued 5 | vue directive 6 | Mads Kristensen 7 | 8 | Expansion 9 | 10 |
11 | 12 | 13 | 14 | name 15 | my-directive 16 | 17 | 18 | 19 | 33 | 34 | 35 | -------------------------------------------------------------------------------- /src/VSPackage.cs: -------------------------------------------------------------------------------- 1 | using System; 2 | using System.Runtime.InteropServices; 3 | using System.Threading; 4 | using EnvDTE; 5 | using EnvDTE80; 6 | using Microsoft.VisualStudio.Shell; 7 | using Microsoft.VisualStudio.Shell.Interop; 8 | 9 | namespace VuePack 10 | { 11 | [PackageRegistration(UseManagedResourcesOnly = true, AllowsBackgroundLoading = true)] 12 | [InstalledProductRegistration("#110", "#112", Vsix.Version, IconResourceID = 400)] 13 | [ProvideAutoLoad(UIContextGuids80.SolutionHasSingleProject, PackageAutoLoadFlags.BackgroundLoad)] 14 | [ProvideAutoLoad(UIContextGuids80.SolutionHasMultipleProjects, PackageAutoLoadFlags.BackgroundLoad)] 15 | [Guid("b2295a37-9de5-4be8-8a5e-7bbb7ecdc3ca")] 16 | [ProvideMenuResource("Menus.ctmenu", 1)] 17 | public sealed class VuePackage : AsyncPackage 18 | { 19 | private SolutionEvents _events; 20 | 21 | protected override async System.Threading.Tasks.Task InitializeAsync(CancellationToken cancellationToken, IProgress progress) 22 | { 23 | var dte = await GetServiceAsync(typeof(DTE)) as DTE2; 24 | 25 | _events = dte.Events.SolutionEvents; 26 | _events.AfterClosing += delegate { DirectivesCache.Clear(); }; 27 | } 28 | } 29 | } 30 | -------------------------------------------------------------------------------- /src/HTML/Completion/ElementCompletion.cs: -------------------------------------------------------------------------------- 1 | using System.Collections.Generic; 2 | using Microsoft.Html.Editor.Completion; 3 | using Microsoft.Html.Editor.Completion.Def; 4 | using Microsoft.VisualStudio.Utilities; 5 | 6 | namespace VuePack 7 | { 8 | [HtmlCompletionProvider(CompletionTypes.Children, "*")] 9 | [ContentType("htmlx")] 10 | class ElementCompletion : BaseCompletion 11 | { 12 | public override string CompletionType 13 | { 14 | get { return CompletionTypes.Children; } 15 | } 16 | 17 | public override IList GetEntries(HtmlCompletionContext context) 18 | { 19 | var list = new List 20 | { 21 | CreateItem("partial", " tags serve as outlets for registered partials. Partial contents are also compiled by Vue when inserted. The element itself will be replaced. It requires a name attribute to be provided.", context.Session), 22 | CreateItem("component", "Alternative syntax for invoking components. Primarily used for dynamic components with the \"is\" attribute", context.Session), 23 | CreateItem("render", "Used to render templates", context.Session), 24 | }; 25 | 26 | return list; 27 | } 28 | } 29 | } 30 | -------------------------------------------------------------------------------- /VuePack2017.sln: -------------------------------------------------------------------------------- 1 | 2 | Microsoft Visual Studio Solution File, Format Version 12.00 3 | # Visual Studio 14 4 | VisualStudioVersion = 14.0.25123.0 5 | MinimumVisualStudioVersion = 10.0.40219.1 6 | Project("{FAE04EC0-301F-11D3-BF4B-00C04F79EFBC}") = "Vue.js Pack", "src\VuePack.csproj", "{C692EEF9-4189-4E7B-B2D8-873552B4A15D}" 7 | EndProject 8 | Project("{2150E333-8FDC-42A3-9474-1A3956D46DE8}") = "Solution Items", "Solution Items", "{D166EEB4-832B-46C1-867F-CB589787D6BF}" 9 | ProjectSection(SolutionItems) = preProject 10 | appveyor.yml = appveyor.yml 11 | CHANGELOG.md = CHANGELOG.md 12 | README.md = README.md 13 | EndProjectSection 14 | EndProject 15 | Global 16 | GlobalSection(SolutionConfigurationPlatforms) = preSolution 17 | Debug|Any CPU = Debug|Any CPU 18 | Release|Any CPU = Release|Any CPU 19 | EndGlobalSection 20 | GlobalSection(ProjectConfigurationPlatforms) = postSolution 21 | {C692EEF9-4189-4E7B-B2D8-873552B4A15D}.Debug|Any CPU.ActiveCfg = Debug|Any CPU 22 | {C692EEF9-4189-4E7B-B2D8-873552B4A15D}.Debug|Any CPU.Build.0 = Debug|Any CPU 23 | {C692EEF9-4189-4E7B-B2D8-873552B4A15D}.Release|Any CPU.ActiveCfg = Release|Any CPU 24 | {C692EEF9-4189-4E7B-B2D8-873552B4A15D}.Release|Any CPU.Build.0 = Release|Any CPU 25 | EndGlobalSection 26 | GlobalSection(SolutionProperties) = preSolution 27 | HideSolutionNode = FALSE 28 | EndGlobalSection 29 | EndGlobal 30 | -------------------------------------------------------------------------------- /src/HTML/Completion/ElementDirectiveCompletion.cs: -------------------------------------------------------------------------------- 1 | using System.Collections.Generic; 2 | using System.Text.RegularExpressions; 3 | using Microsoft.Html.Editor.Completion; 4 | using Microsoft.Html.Editor.Completion.Def; 5 | using Microsoft.VisualStudio.Utilities; 6 | 7 | namespace VuePack 8 | { 9 | [HtmlCompletionProvider(CompletionTypes.Children, "*")] 10 | [ContentType("htmlx")] 11 | class ElementDirectiveCompletion : BaseCompletion 12 | { 13 | public override string CompletionType 14 | { 15 | get { return CompletionTypes.Children; } 16 | } 17 | 18 | public override IList GetEntries(HtmlCompletionContext context) 19 | { 20 | string text = context.Document.TextBuffer.CurrentSnapshot.GetText(); 21 | var names = DirectivesCache.GetValues(DirectiveType.Element); 22 | var list = new List(); 23 | 24 | foreach (Match match in DirectivesCache.ElementRegex.Matches(text)) 25 | { 26 | var name = match.Groups["name"].Value; 27 | if (!names.Contains(name)) 28 | names.Add(name); 29 | } 30 | 31 | foreach (string name in names) 32 | { 33 | var item = CreateItem(name, "Custom component/directive", context.Session); 34 | list.Add(item); 35 | } 36 | 37 | return list; 38 | } 39 | } 40 | } 41 | -------------------------------------------------------------------------------- /src/HTML/Completion/AttributeDirectiveCompletion.cs: -------------------------------------------------------------------------------- 1 | using System.Collections.Generic; 2 | using System.Text.RegularExpressions; 3 | using Microsoft.Html.Editor.Completion; 4 | using Microsoft.Html.Editor.Completion.Def; 5 | using Microsoft.VisualStudio.Utilities; 6 | 7 | namespace VuePack 8 | { 9 | [HtmlCompletionProvider(CompletionTypes.Attributes, "*")] 10 | [ContentType("htmlx")] 11 | class AttributeDirectiveCompletion : BaseCompletion 12 | { 13 | public override string CompletionType 14 | { 15 | get { return CompletionTypes.Attributes; } 16 | } 17 | 18 | public override IList GetEntries(HtmlCompletionContext context) 19 | { 20 | string text = context.Document.TextBuffer.CurrentSnapshot.GetText(); 21 | var names = DirectivesCache.GetValues(DirectiveType.Attribute); 22 | var list = new List(); 23 | 24 | foreach (Match match in DirectivesCache.AttributeRegex.Matches(text)) 25 | { 26 | var name = match.Groups["name"].Value; 27 | if (!names.Contains(name)) 28 | names.Add(name); 29 | } 30 | 31 | foreach (string name in names) 32 | { 33 | var item = CreateItem(name, "Custom directive", context.Session); 34 | list.Add(item); 35 | } 36 | 37 | return list; 38 | } 39 | } 40 | } 41 | -------------------------------------------------------------------------------- /src/Helpers/ProjectHelpers.cs: -------------------------------------------------------------------------------- 1 | using System; 2 | using System.IO; 3 | using EnvDTE; 4 | 5 | namespace VuePack 6 | { 7 | static class ProjectHelpers 8 | { 9 | public static string GetRootFolder(this Project project) 10 | { 11 | if (string.IsNullOrEmpty(project.FullName)) 12 | return null; 13 | 14 | string fullPath; 15 | 16 | try 17 | { 18 | fullPath = project.Properties.Item("FullPath").Value as string; 19 | } 20 | catch (ArgumentException) 21 | { 22 | try 23 | { 24 | // MFC projects don't have FullPath, and there seems to be no way to query existence 25 | fullPath = project.Properties.Item("ProjectDirectory").Value as string; 26 | } 27 | catch (ArgumentException) 28 | { 29 | // Installer projects have a ProjectPath. 30 | fullPath = project.Properties.Item("ProjectPath").Value as string; 31 | } 32 | } 33 | 34 | if (string.IsNullOrEmpty(fullPath)) 35 | return File.Exists(project.FullName) ? Path.GetDirectoryName(project.FullName) : null; 36 | 37 | if (Directory.Exists(fullPath)) 38 | return fullPath; 39 | 40 | if (File.Exists(fullPath)) 41 | return Path.GetDirectoryName(fullPath); 42 | 43 | return null; 44 | } 45 | } 46 | } 47 | -------------------------------------------------------------------------------- /src/source.extension.vsixmanifest: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | Vue.js Pack 2017 6 | Contains HTML Intellisense and code snippets for the Vue.js JavaScript library 7 | https://github.com/madskristensen/VuePack2017 8 | Resources\LICENSE 9 | https://github.com/madskristensen/VuePack2017/blob/master/CHANGELOG.md 10 | Resources\icon.png 11 | Resources\Preview.png 12 | vue.js, snippets, javascript 13 | 14 | 15 | 16 | 17 | 18 | 19 | 20 | 21 | 22 | 23 | 24 | 25 | 26 | 27 | -------------------------------------------------------------------------------- /src/HTML/Completion/BaseCompletion.cs: -------------------------------------------------------------------------------- 1 | using System; 2 | using System.Collections.Generic; 3 | using System.Runtime.InteropServices; 4 | using System.Windows.Media; 5 | using System.Windows.Media.Imaging; 6 | using Microsoft.Html.Editor.Completion; 7 | using Microsoft.Html.Editor.Completion.Def; 8 | using Microsoft.VisualStudio.Imaging.Interop; 9 | using Microsoft.VisualStudio.Language.Intellisense; 10 | using Microsoft.VisualStudio.Shell; 11 | using Microsoft.VisualStudio.Shell.Interop; 12 | 13 | namespace VuePack 14 | { 15 | abstract class BaseCompletion : IHtmlCompletionListProvider 16 | { 17 | private static ImageSource _icon = GetImage(Images.VueFile, 16); 18 | 19 | public abstract string CompletionType { get; } 20 | 21 | public abstract IList GetEntries(HtmlCompletionContext context); 22 | 23 | public static BitmapSource GetImage(ImageMoniker moniker, int size) 24 | { 25 | ImageAttributes imageAttributes = new ImageAttributes 26 | { 27 | Flags = (uint)_ImageAttributesFlags.IAF_RequiredFlags, 28 | ImageType = (uint)_UIImageType.IT_Bitmap, 29 | Format = (uint)_UIDataFormat.DF_WPF, 30 | LogicalHeight = size, 31 | LogicalWidth = size, 32 | StructSize = Marshal.SizeOf(typeof(ImageAttributes)) 33 | }; 34 | 35 | var imageService = (IVsImageService2)Package.GetGlobalService(typeof(SVsImageService)); 36 | var image = imageService.GetImage(moniker, imageAttributes); 37 | 38 | object data; 39 | image.get_Data(out data); 40 | 41 | if (data == null) 42 | return null; 43 | 44 | return data as BitmapSource; 45 | } 46 | 47 | protected HtmlCompletion CreateItem(string name, string description, ICompletionSession session) 48 | { 49 | string desc = description + Environment.NewLine + Environment.NewLine + Vsix.Name; 50 | return new HtmlCompletion(name, name, desc, _icon, null, session); 51 | } 52 | } 53 | } 54 | -------------------------------------------------------------------------------- /src/HTML/VueCreationListener.cs: -------------------------------------------------------------------------------- 1 | using System.Collections.Generic; 2 | using System.ComponentModel.Composition; 3 | using System.IO; 4 | using System.Threading.Tasks; 5 | using Microsoft.VisualStudio.Editor; 6 | using Microsoft.VisualStudio.Text; 7 | using Microsoft.VisualStudio.Text.Editor; 8 | using Microsoft.VisualStudio.TextManager.Interop; 9 | using Microsoft.VisualStudio.Utilities; 10 | using System; 11 | 12 | namespace VuePack 13 | { 14 | [Export(typeof(IVsTextViewCreationListener))] 15 | [ContentType(VueContentTypeDefinition.VueContentType)] 16 | [ContentType("javascript")] 17 | [TextViewRole(PredefinedTextViewRoles.PrimaryDocument)] 18 | class VueCreationListener : IVsTextViewCreationListener 19 | { 20 | [Import] 21 | public IVsEditorAdaptersFactoryService EditorAdaptersFactoryService { get; set; } 22 | 23 | [Import] 24 | public ITextDocumentFactoryService DocumentService { get; set; } 25 | 26 | private ITextDocument _document; 27 | 28 | public void VsTextViewCreated(IVsTextView textViewAdapter) 29 | { 30 | var textView = EditorAdaptersFactoryService.GetWpfTextView(textViewAdapter); 31 | 32 | // Both "Web Compiler" and "Bundler & Minifier" extensions add this property on their 33 | // generated output files. Generated output should be ignored from linting 34 | if (textView.Properties.TryGetProperty("generated", out bool generated) && generated) 35 | return; 36 | 37 | if (DocumentService.TryGetTextDocument(textView.TextDataModel.DocumentBuffer, out _document)) 38 | { 39 | if (_document.FilePath.EndsWith(".vue", StringComparison.OrdinalIgnoreCase)) 40 | _document.FileActionOccurred += DocumentSaved; 41 | } 42 | } 43 | 44 | private void DocumentSaved(object sender, TextDocumentFileActionEventArgs e) 45 | { 46 | if (e.FileActionType == FileActionTypes.ContentSavedToDisk) 47 | { 48 | Task.Run(() => 49 | { 50 | DirectivesCache.ProcessFile(e.FilePath); 51 | }); 52 | } 53 | } 54 | 55 | private static List GetFiles(string path, string pattern) 56 | { 57 | var files = new List(); 58 | 59 | if (path.Contains("node_modules")) 60 | return files; 61 | 62 | try 63 | { 64 | files.AddRange(Directory.GetFiles(path, pattern, SearchOption.TopDirectoryOnly)); 65 | foreach (var directory in Directory.GetDirectories(path)) 66 | files.AddRange(GetFiles(directory, pattern)); 67 | } 68 | catch { } 69 | 70 | return files; 71 | } 72 | } 73 | } 74 | -------------------------------------------------------------------------------- /src/packages.config: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 | 19 | 20 | 21 | 22 | 23 | 24 | 25 | 26 | 27 | 28 | 29 | 30 | 31 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | # Vue Pack 2017 2 | 3 | [![Build status](https://ci.appveyor.com/api/projects/status/us0kd0r6tphv2djr?svg=true)](https://ci.appveyor.com/project/madskristensen/vuepack2017) 4 | 5 | Download this extension from the [VS Marketplace](https://marketplace.visualstudio.com/items?itemName=MadsKristensen.VuejsPack-18329) 6 | or get the [CI build](http://vsixgallery.com/extension/4163aa08-9878-4b1c-a1ee-58ab67f7db5b/). 7 | 8 | --------------------------------------- 9 | 10 | Contains HTML Intellisense and code snippets for the 11 | [Vue.js](http://vuejs.org) 12 | JavaScript library 13 | 14 | See the [changelog](CHANGELOG.md) for changes and roadmap. 15 | 16 | ## Features 17 | 18 | - **.vue** files are mapped to open in the HTML editor 19 | - HTML Intellisense for built-in directives 20 | - HTML Intellisense for custom directives and components 21 | - File icon for **.vue** files 22 | - JavaScript snippets 23 | 24 | ### Directives Intellisense 25 | Built in directives are shown in Intellisense to make it easier 26 | to write an to avoid typos. 27 | 28 | Any directive or component defined in any .vue or .js file in 29 | the project will be show up in Intellisense. 30 | 31 | #### Built in directives 32 | ![HTML Intellisense](art/html-intellisense.png) 33 | 34 | #### Special elements 35 | ![HTML Intellisense partial](art/html-intellisense-partial.png) 36 | 37 | #### Custom components/elementDirectives 38 | ![HTML Intellisense components](art/html-intellisense-component.png) 39 | 40 | #### Custom directives 41 | ![HTML Intellisense directives](art/html-intellisense-directives.png) 42 | 43 | ### File icon 44 | Solution Explorer correctly displays a file icon for .vue 45 | files. 46 | 47 | ![File icon](art/file-icon.png) 48 | 49 | ### JavaScript snippets 50 | A few handy snippets are available to speed up boilerplating 51 | of vew models, filters and directives. 52 | 53 | #### vue (view model) 54 | 55 | ```javascript 56 | var vm = new Vue({ 57 | 58 | el: "#app" 59 | 60 | }) 61 | ``` 62 | 63 | #### vued (directive) 64 | 65 | ```javascript 66 | Vue.directive('my-directive', { 67 | 68 | bind: function () { 69 | // content 70 | }, 71 | 72 | update: function (value) { 73 | // content 74 | }, 75 | 76 | unbind: function () { 77 | // content 78 | } 79 | }) 80 | ``` 81 | 82 | #### vuef (filter) 83 | 84 | ```javascript 85 | Vue.filter('my-filter', function (value) { 86 | 87 | $end$ 88 | 89 | }) 90 | ``` 91 | 92 | Here's what it looks like in the Code Snippets Manager. 93 | 94 | ![Snippets](art/snippets.png) 95 | 96 | ## Contribute 97 | Check out the [contribution guidelines](CONTRIBUTING.md) 98 | if you want to contribute to this project. 99 | 100 | For cloning and building this project yourself, make sure 101 | to install the 102 | [Extensibility Tools 2015](https://visualstudiogallery.msdn.microsoft.com/ab39a092-1343-46e2-b0f1-6a3f91155aa6) 103 | extension for Visual Studio which enables some features 104 | used by this project. 105 | 106 | ## License 107 | [Apache 2.0](LICENSE) -------------------------------------------------------------------------------- /src/HTML/Completion/AttributeCompletion.cs: -------------------------------------------------------------------------------- 1 | using System.Collections.Generic; 2 | using Microsoft.Html.Editor.Completion; 3 | using Microsoft.Html.Editor.Completion.Def; 4 | using Microsoft.VisualStudio.Utilities; 5 | 6 | namespace VuePack 7 | { 8 | [HtmlCompletionProvider(CompletionTypes.Attributes, "*")] 9 | [ContentType("htmlx")] 10 | class AttributeCompletion : BaseCompletion 11 | { 12 | Dictionary _attributes = new Dictionary 13 | { 14 | { "track-by", "" }, 15 | { "v-attr", "Updates the element’s given attribute (indicated by the argument)." }, 16 | { "v-class", "If no argument is provided, it will add the binding’s value to the element’s classList, and update the class as the value changes." }, 17 | { "v-cloak", "This property remains on the element until the associated ViewModel finishes compilation. Combined with CSS rules such as [v-cloak] { display: none }, this directive can be used to hide un-compiled mustache bindings until the ViewModel is ready." }, 18 | { "v-el", "Register a reference to a DOM element on its owner Vue instance for easier access. e.g.
will be accessible as vm.$$.hi." }, 19 | { "v-for", "We can use the v-for directive to render a list of items based on an Array. The v-for directive requires a special syntax in the form of item in items, where items is the source data Array and item is an alias for the Array element being iterated on" }, 20 | { "v-html", "Updates the element’s innerHTML." }, 21 | { "v-if", "Conditionally insert / remove the element based on the truthy-ness of the binding value. If the element is a