Jade就像.pug文件Visual Studio 2015的语法高亮一样

时间:2016-05-26 15:27:09

标签: visual-studio-2015 pug pugjs

这可能是一个非常愚蠢的问题,但我找不到任何让它工作的选择。

在最近将npm软件包名称从jade更改为pug后,我已经将我项目中的所有.jade文件更改为.pug - 正如软件包所要求的那样。

这引起了一个琐碎的问题 - 在.pug文件中没有突出显示jade语法。更重要的是,我找不到在VS15中为.pug扩展文件添加玉编辑体验的选项。

enter image description here

有人知道如何让它发挥作用吗?

3 个答案:

答案 0 :(得分:6)

右键单击解决方案资源管理器中的.pug文件,选择“打开方式”,然后选择Jade编辑器。

此外,如果您希望.pug / .jade文件中的缩进为2个空格而不是4个以匹配Pug文档和示例,您可以转到工具> 选项> 文字编辑器> Jade > 标签,然后将“标签尺寸”和“缩进尺寸”设置为2.

答案 1 :(得分:1)

user1257979附带更好的解决方案https://stackoverflow.com/a/38153085/5647513

<小时/> 我的hackish解决方案:

如果您通过.jade等完整文件名引用文件,则可以使用extends layout.jade扩展名。[/ p>

如果使用Express框架,还应该在快速初始化时设置渲染引擎:

app.set('view engine', 'jade');
app.engine('jade', require('pug').__express);

<强>更新: 您还可以添加帖子构建操作,将所有*.jade文件复制到*.pug

postBuild.bat添加到项目的根目录,其中包含:

@cd views
@FOR %%F IN ( *.jade ) DO @( @echo Emited %%~nF.pug && @copy %%F %%~nF.pug >nul )
@cd ..

然后将帖子构建操作添加到.njsproj

<Import Project="$(VSToolsPath)\Node.js Tools\Microsoft.NodejsTools.targets" />

  <!-- PostBuild Step-->
  <PropertyGroup>
    <PostBuildEvent>
      .\postBuild.bat
    </PostBuildEvent>
  </PropertyGroup>

答案 2 :(得分:0)

可以使用“语法高亮包”扩展,它增加了对许多类型文件的支持 https://visualstudiogallery.msdn.microsoft.com/d92fd742-bab3-4314-b866-50b871d679ee