在我的 Blazor 项目中遇到字符集问题答案

【问题标题】：Having issues with charset in my blazor project在我的 Blazor 项目中遇到字符集问题
【发布时间】：2019-12-31 13:03:32
【问题描述】：

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="ie=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0, shrink-to-fit=no" />
    <meta name="description" content="Guild Project"/>
    <title>Mission Control</title>
    <base href="/" />
    <script src="localStorage.js"></script>
    <link href="_content/RazorComponentsMaterialDesign/styles.css" rel="stylesheet" />
    <script src="_content/RazorComponentsMaterialDesign/script.js"></script>
    <script src="_content/RazorComponentsMaterialDesign/lib/material-components-web.js"></script>
    <link href="css/Layout.css" rel="stylesheet" />
    <script src="https://api.tiles.mapbox.com/mapbox-gl-js/v1.0.0/mapbox-gl.js"></script>
    <link href="https://api.tiles.mapbox.com/mapbox-gl-js/v1.0.0/mapbox-gl.css" rel="stylesheet" />
</head>
<body style="margin: 0px">

    <app>
        <!-- "Loading" spinner -->
        <div role="progressbar" class="mdc-linear-progress mdc-linear-progress--indeterminate">
            <div class="mdc-linear-progress__buffer"></div>
            <div class="mdc-linear-progress__bar mdc-linear-progress__primary-bar"><span class="mdc-linear-progress__bar-inner"></span></div>
            <div class="mdc-linear-progress__bar mdc-linear-progress__secondary-bar"><span class="mdc-linear-progress__bar-inner"></span></div>
        </div>
    </app>

    <script src="_framework/blazor.webassembly.js"></script>
    <script src="_content/PinMapLibrary/PinMap.js"></script>

</body>
</html>

Index.razor ä»£ç ï¼

@page "/"
@using MissionControl.Client.Components;

<html>
    <head>
        <meta charset="UTF-8">
    </head>
    <body>
        <div class="layout">
            <div class="sidebar">
                <Sidebar/>
            </div>
        </div>
    </body>
</html>

æå¨è¿éè°ç¨ç»ä»¶Sidebarï¼å¶ä¸ææéè¦éé³çåè¯ã

ä¾§è¾¹æ ä»£ç ï¼

<p>PermissÃµes</p>

ãé®é¢è®¨è®ºãï¼

Index.razor ä¸åºåå« ã æ æ è®°ãè¿å½ç¶æ²¡æå¸®å©ã
æ å¤å¶ãæå°<p>PermissÃµes</p> æ¾å¨ä¸ä¸ªé¡µé¢ä¸ï¼å®å¯ä»¥æ£å¸¸å·¥ä½ã
åå»ºä¸ä¸ªminimal reproducible exampleãä»ä¸ä¸ªæ°çæ åæ¨¡æ¿å¼å§ï¼åæå°çæ¹åæ¥æ¼ç¤ºé®é¢ãå¨æ¤å¤åå¸æææ¥éª¤ä»¥åææç¸å³çæ¬å·ã
æååå é¤äº ã å æ ç¾ï¼ä½ä»ç¶æåæ ·çé®é¢ãæååå®ææµè¯ï¼é®é¢æ¯è°ç¨ç»ä»¶ãæä»¥å¦æææè¿ä¸ªè¯æ¾å¨æç Index.razor ä¸æ²¡å³ç³»ï¼ä½å¨æçä¾§è¾¹æ ç»ä»¶ä¸ä¸èµ·ä½ç¨ã
æ¨æ¯å¦å°è¯å¯¹ Sidebar.razor ååæ ·çäºæï¼åºæ¬ä¸ï¼ç¨ utf-8 ç¼ç ä¿åææåå®¹

标签： blazor

【解决方案1】：

使用 UTF-8 编码保存所有源代码：

在 Visual Studio 中

选择一个文件
点击文件 -> 将{文件}另存为...
单击保存按钮上的向下箭头
点击Save with Enconding...
在编码中选择Unicode（带签名的UTF-8）-代码页65001
点击确定

将 VS 配置为默认保存为 Unicode：

工具 -> 选项 -> 环境 -> 文档
勾选在代码页中无法保存数据时将文档另存为 Unicode

【讨论】：