使用 Blazor WebAssembly 在 .NET Visual Studio 中找不到 JS 文件

Question

我正在尝试在 Blazor 中将一个名为 chatfunction.js 的 JS 脚本文件添加到我的 index.html 中，但它给了我一个找不到文件的错误。我的 CSS 链接正确，HTML 和 CSS 都显示了，但它没有提供我实现的任何 JS 功能。

我将它添加到我的 HTML 底部 index.html 中，如下所示：

....
 <script src="_framework/blazor.webassembly.js"></script>
    <script src="chatfunction.js"></script>

</body>

</html>

这是我的项目结构

现在，当我尝试编译时，它给了我这个错误：

(JS) File 'C:/Users/darka/source/repos/chatproject/wwwroot/js/mysrc.js' not found.

我不明白为什么它找不到它，我很困惑为什么它认为我的文件是 mysrc.js，因为在我的项目结构中没有这样的文件。

任何指针如何解决这个问题？

这是我的 JS 文件的布局

var botController = (function () {


})();

var uiController = (function () {


})();




var controller = (function (botCntr, uiCntr) {
    var $chatCircle,
        $chatBox,
        $chatBoxClose,
        $chatBoxWelcome,
        $chatWraper,
        $submitBtn,
        $chatInput,
        $msg;

    /*toggle*/
    function hideCircle(evt) {
        evt.preventDefault();
        $chatCircle.hide('scale');
        $chatBox.show('scale');
        $chatBoxWelcome.show('scale');
    }

    function chatBoxCl(evt) {
        evt.preventDefault();
        $chatCircle.show('scale');
        $chatBox.hide('scale');
        $chatBoxWelcome.hide('scale');
        $chatWraper.hide('scale');
    }

    function chatOpenMessage(evt) {
        evt.preventDefault();
        $chatBoxWelcome.hide();
        $chatWraper.show();
    }

    //generate messages on submit click
    function submitMsg(evt) {
        evt.preventDefault();

        //1. get input message data
        msg = $chatSubmitBtn.val();

        //2.if there is no string button send shoudn't work
        if (msg.trim() == '') {
            return false;
        }
        //3. add message to bot controller
        callbot(msg);
        //4. display message to ui controller
        generate_message(msg, 'self');

    }

    function chatSbmBtn(evt) {
        if (evt.keyCode === 13 || evt.which === 13) {
            console.log("btn pushed");
        }
    }
    /* var input = uiCntr.getInput();*/
    /* $chatSubmitBtn.on("click", hideCircle);*/



    function init() {
        $chatCircle = $("#chat-circle");
        $chatBox = $(".chat-box");
        $chatBoxClose = $(".chat-box-toggle");
        $chatBoxWelcome = $(".chat-box-welcome__header");
        $chatWraper = $("#chat-box__wraper");
        $chatInput = $("#chat-input__text");
        $submitBtn = $("#chat-submit");

        //1. call toggle 
        $chatCircle.on("click", hideCircle);
        $chatBoxClose.on("click", chatBoxCl);
        $chatInput.on("click", chatOpenMessage);

        //2. call wait message from CRM-human

        $submitBtn.on("click", chatSbmBtn);
        $chatInput.on("keypress", chatSbmBtn);


        //6. get message from bot controller-back end
        //7. display bot message to ui controller
    }

    return {
        init: init
    };

})(botController, uiController);


$('.chat-input__form').on('submit', function (e) {
    e.preventDefault();
    msg = $('.chat-input__text').val();

    $('.chat-logs').append('<div id="cm-msg-0" class="chat-msg background-warning push-right bot"><div class="cm-msg-text">' + msg + '</div><span class="msg-avatar"><img class="chat-box-overlay_robot" src="https://www.meetsource.com//userStyles/images/user.png"></span></div>');
    $('.chat-input__text').val('');
});


$(document).ready(controller.init);


function talk() {
    var user = document.getElementById("userBox").value;
    document.getElementById("userBox").value = "";
    document.getElementById("chatLog").innerHTML += user + "<br>";

} 

Answer 1

我认为您的脚本行需要是：

<script src="js/chatfunction.js"></script>