开发语法应用 SharePoint Online PrismJS

Developing Syntax app SharePoint Online PrismJS

我正在尝试使用 Napa 构建 SharePoint Online 应用程序以使用语法突出显示。我开始了一个新项目,并在 Default.aspx 网页中包含了 .js 和 .css 文件。当我尝试创建突出显示的代码块时,它不起作用。

PS:我不是程序员:)

.js和.css文件上传到script和content文件夹,default.aspx代码如下:

<%-- The following 4 lines are ASP.NET directives needed when using SharePoint components --%>

<%@ Page Inherits="Microsoft.SharePoint.WebPartPages.WebPartPage, Microsoft.SharePoint, Version=15.0.0.0, Culture=neutral, PublicKeyToken=71e9bce111e9429c" MasterPageFile="~masterurl/default.master" Language="C#" %>

<%@ Register TagPrefix="SharePoint" Namespace="Microsoft.SharePoint.WebControls" Assembly="Microsoft.SharePoint, Version=15.0.0.0, Culture=neutral, PublicKeyToken=71e9bce111e9429c" %>
<%@ Register TagPrefix="Utilities" Namespace="Microsoft.SharePoint.Utilities" Assembly="Microsoft.SharePoint, Version=15.0.0.0, Culture=neutral, PublicKeyToken=71e9bce111e9429c" %>
<%@ Register TagPrefix="WebPartPages" Namespace="Microsoft.SharePoint.WebPartPages" Assembly="Microsoft.SharePoint, Version=15.0.0.0, Culture=neutral, PublicKeyToken=71e9bce111e9429c" %>

<%-- The markup and script in the following Content element will be placed in the <head> of the page --%>
<asp:Content ContentPlaceHolderID="PlaceHolderAdditionalPageHead" runat="server">
    <script type="text/javascript" src="https://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.9.1.min.js"></script>
    <script type="text/javascript" src="/_layouts/15/sp.runtime.js"></script>
    <script type="text/javascript" src="/_layouts/15/sp.js"></script>

    <!-- Add your CSS styles to the following file -->
    <link rel="Stylesheet" type="text/css" href="../Content/prism.css" />
    <link rel="Stylesheet" type="text/css" href="../Content/App.css" />

    <!-- Add your JavaScript to the following file -->
    <script type="text/javascript" src="../Scripts/prism.js"></script>
    <script type="text/javascript" src="../Scripts/App.js"></script>
</asp:Content>

<%-- The markup and script in the following Content element will be placed in the <body> of the page --%>
<asp:Content ContentPlaceHolderID="PlaceHolderMain" runat="server">
    <pre class="line-numbers"><code class="language-*">
        <!DOCTYPE html>
        <html lang="en">
        <head>
            <meta charset="utf-8" />
            <title>I can haz embedded CSS and JS</title>
            <style>
                @media print {
                    p { color: red !important; }
                }
            </style>
        </head>
        <body>
            <h1>I can haz embedded CSS and JS</h1>
            <script>
            if (true) {
                console.log('foo');
            }
            </script>

        </body>
        </html>
    </code></pre>
</asp:Content>

在脚本标签中添加 type = "text/javascript。同时将 'if' 放在函数下。

您缺少 <code></code> 个标签。

Prism.js 不高亮任何语法 not encased within the code 标签。