Visual Studio 2019 Typescript 自定义项模板



我正在尝试在Visual Studio 2019中创建自定义项模板,我尝试从使用Project->Export Template导出项目中的现有文件开始,并保留所有默认值。但是无论文件复制到哪里,它都不会显示在我搜索所有组Solution Explorer->Context Menu->Add->New Item它没有出现。 我发现了其他几个关于这个问题的问题,但似乎都没有奏效。

自定义项模板未显示在 Visual Studio 2015 添加新项对话框中

自定义项模板未显示在 Visual Studio 2010 中 - 添加新项

我认为使用工作模板会起作用,所以我从

C:Program Files (x86)Microsoft Visual Studio2019CommunityCommon7IDEItemTemplatesJavaScriptCodetsxfile

C:Users<user>DocumentsVisual Studio 2019TemplatesItemTemplatesJavaScriptCodereactComponent并修改了它。

reactFuncComp.vstemplate


<?xml version="1.0" encoding="utf-8"?>
<VSTemplate Version="3.0.0" Type="Item" xmlns="http://schemas.microsoft.com/developer/vstemplate/2005">
<TemplateData>
<Name>React Function Component</Name>
<Description>React Function Component</Description>
<Icon Package="{2ffe45c4-5c73-493c-b187-f2e955ff875e}" ID="3"></Icon>
<TemplateID>ReactFunctionComponent.tsxfile</TemplateID>
<NumberOfParentCategoriesToRollUp>1</NumberOfParentCategoriesToRollUp>
<DefaultName>reactComponent.tsx</DefaultName>
<!-- TypeScript project capability is applicable to all JavaScript projects -->
<!-- "ShowByDefault = false" is needed for the "AppliesTo" to apply the condition(s) to projects that don't restrict specific templates -->
<ProjectType>JavaScript</ProjectType>
<ShowByDefault>false</ShowByDefault>
<AppliesTo>JavaScript</AppliesTo>
</TemplateData>
<TemplateContent>
<ProjectItem SubType="Code" ItemType="TypeScriptCompile" TargetFileName="$fileinputname$.tsx" ReplaceParameters="true">reactFuncComp.tsx</ProjectItem>
</TemplateContent>
</VSTemplate>

reactFuncComp.tsx


import * as React from "react";
export const $safeitemname$: React.FunctionComponent = (props) => {
return (
<div>
{props.children}
</div>
); 
}
export default $safeitemname$;

我仔细检查了模板位置是否正确,在Tools->Options->Projects and Solutions->Locations下,它指向

C:Users<user>DocumentsVisual Studio 2019TemplatesItemTemplates

我还尝试将新模板复制到我从中复制它的位置

C:Program Files (x86)Microsoft Visual Studio2019CommunityCommon7IDEItemTemplatesJavaScriptCodereactFuncComp

仍然什么都没有,我错过了什么吗?

我终于出现了这个,我注意到还有另一个文件夹包含其他模板,我从复制开始

C:Program Files (x86)Microsoft Visual Studio2019CommunityCommon7IDEItemTemplatesAspNetCoreWebScripts1033TypeScriptJsxFile

C:Users<user>DocumentsVisual Studio 2019TemplatesItemTemplatesReactFunctionComponent

并对其进行了修改。我相信我缺少模板组 ID:

<TemplateGroupID>AspNetCore</TemplateGroupID>

reactFuncComp.vstemplate


<?xml version="1.0" encoding="utf-8"?>
<VSTemplate Version="3.0.0" Type="Item" xmlns="http://schemas.microsoft.com/developer/vstemplate/2005">
<TemplateData>
<Name>React Function Component</Name>
<Description>React Function Component template file</Description>
<Icon Package="{2ffe45c4-5c73-493c-b187-f2e955ff875e}" ID="3"></Icon>
<ProjectType>CSharp</ProjectType>
<TemplateGroupID>AspNetCore</TemplateGroupID>
<TemplateID>ReactFunctionComponent</TemplateID>
<NumberOfParentCategoriesToRollUp>3</NumberOfParentCategoriesToRollUp>
<DefaultName>reactComp.tsx</DefaultName>
<SortOrder>1</SortOrder>
<ShowByDefault>false</ShowByDefault>
</TemplateData>
<TemplateContent>
<ProjectItem SubType="Code" TargetFileName="$fileinputname$.tsx" ReplaceParameters="true">reactFuncComp.tsx</ProjectItem>
</TemplateContent>
</VSTemplate>

reactFuncComp.tsx


import * as React from "react";
export const $safeitemname$: React.FunctionComponent = (props) => {
return (
<div>
{props.children}
</div>
); 
}
export default $safeitemname$;

相关内容

  • 没有找到相关文章

最新更新