Question

我使用材料设计精简创建了一个网站：

脚本：

   <script src="./mdl/material.min.js"></script>
   <script src="Scripts/angular.min.js"></script>

包含在html中的.css文件：

    <link rel="stylesheet" href="./mdl/material.min.css">
    <link rel="stylesheet" href="https://fonts.googleapis.com/icon?family=Material+Icons">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">

看起来像这样：

之后我创建了一个新的uwp JavaScript项目，主要是使用C＆amp; P。

结果是：

当然，我为uwp应用了正确的脚本源路径。我的Uwp文件夹结构：

在我的uwp中，路径是这样的：

<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link href="js/mdl/material.min.css" rel="stylesheet" />
<link rel="stylesheet" href="https://fonts.googleapis.com/icon?family=Material+Icons">

在身体中：

<script src="/js/mdl/material.min.js"></script>
<script src="/js/Scripts/angular.min.js"></script>

Answer 1

似乎问题实际上不是本地样式或脚本，而是使用您用于图标的外部样式。 UWP阻止包括外部脚本或css文件到本地上下文中执行的页面。我还要强调，不建议按照设计原则，因为所有与界面相关的图标都不应该依赖于互联网连接。

您应该将材料设计图标的CSS文件包含到项目中（我还假设字体文件）。

Answer 2

或者只是破解UWP的安全性并使用这个技巧：

    function loadExternalScriptAsync (scriptUrl)
{

    return WinJS.xhr({ url: scriptUrl }).then(function(req) {
        var scriptTxt = req.responseText;
        try
        {
            var bb = new MSBlobBuilder();
            bb.append(scriptTxt);
            var data = bb.getBlob('text/javascript');

            var sc = document.createElement('script');
            sc.setAttribute('src', window.URL.createObjectURL(data));
            document.head.appendChild(sc);
            return true;
        }
        catch (e)
        {
            return false;
        }
    })
},

将下载脚本保存为blob，然后将允许它引用它。肯定会对css起作用，并且对JS有一些限制，因为如果下载的脚本自己尝试加载外部脚本它将无法工作我正在使用WinJS.xhr ......但任何XmlHttprequest都可以使用

罗曼

Javascript App Windows Universal - 脚本问题

2 个答案: