自定义WordPress主题加载js，但不加载样式表

我已经尽了最大努力四处寻找，但我找不到解决这个问题的办法。我正在从头开始构建一个自定义WordPress模板，样式表不会加载。出于某种原因，javascript确实如此。以下是我所拥有的：

排队进入functions.php

<?php

function test_enqueue_styles(){
    wp_enqueue_style(\'test-style\', get_template_directory_uri() . "/style.css", array(\'test-bootstrap-css\'), wp_get_theme()->get( \'Version\' ));
    wp_enqueue_style(\'test-bootstrap-css\', get_template_directory_uri() . "/assets/css/bootstrap.css", array(), \'5.1.2\');
    wp_enqueue_style(\'test-icons\', "https://cdn.jsdelivr.net/npm/[email protected]/font/bootstrap-icons.css", array(), \'1.4.1\');

}
add_action( \'wp_enqueue_style\', \'test_enqueue_styles\');

function test_enqueue_scripts(){
    wp_enqueue_script(\'test-bootstrap-js\', get_template_directory_uri() . "/assets/js/scripts.js", array(), wp_get_theme()->get( \'Version\' ));
    wp_enqueue_script(\'test-bootstrap-js\', get_template_directory_uri() . "/assets/js/bootstrap.js", array(), \'5.1.2\');
    wp_enqueue_script(\'test-bootstrap-bundle\', "https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.bundle.min.js", array(), \'5.1.1\');
    
}
add_action( \'wp_enqueue_scripts\', \'test_enqueue_scripts\');

?>

我的测试风格style.css:

/*
Theme Name: Test Theme
Theme Domain: Test Theme
Version: 1.0
Description: A test theme for WordPress
Author: Me
*/

body{
    background-color: crimson !important;
}

唯一包含内容的页面是front-page.php:

<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="utf-8" />
        <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no" />
        <title>Hello World</title>
        <link rel="icon" type="image/x-icon" href="assets/favicon.ico" />
        <!-- Stylesheets-->
        <?php
            wp_head();
        ?>

<!--NOTE THESE COMMENTED LINES-->
        <!-- <link href="https://cdn.jsdelivr.net/npm/[email protected]/font/bootstrap-icons.css" rel="stylesheet" />
        <link href="wp-content/themes/testtheme/assets/css/bootstrap.css" rel="stylesheet" />
        <link href="wp-content/themes/testtheme/style.css" rel="stylesheet" /> -->
    </head>
    <body>
        <div class="container">
            <h1 class="jumbotron">Hello World</h1>
        </div>
    
    <?php
       wp_footer();        
    ?>
    </body>
</html>

当我取消注释中提到的行时front-page.php, 该页面完全按照预期工作。否则，三个样式表不会从wp_head(). 时期无论我按ctrl+f5多少次，它们都不会出现在页面源代码中，也不会在“开发人员工具”网络选项卡中引用。

奇怪的是，来自同一文件的脚本排队加载脚本。脚本显示在网络选项卡和控制台登录脚本中。js输出到控制台。只是样式表出了问题。Bootstrap是v5.1.2，直接从getbootstrap下载。com公司

我还尝试了以下方法functions.php:

<?php

function test_enqueue_styles(){
    wp_register_style(\'test-style\', get_template_directory_uri() . "/style.css", array(\'test-bootstrap\'), wp_get_theme()->get( \'Version\' ));
    wp_register_style(\'test-bootstrap\', get_template_directory_uri() . "/assets/css/style.css", array(), \'1.0\');
    wp_register_style(\'test-icons\', "https://cdn.jsdelivr.net/npm/[email protected]/font/bootstrap-icons.css", array(), \'1.0\');

    wp_enqueue_style(\'test-style\');
    wp_enqueue_style(\'test-bootstrap\');
    wp_enqueue_style(\'test-icons\');
}
add_action( \'wp_enqueue_style\', \'test_enqueue_styles\');

//javascript same as above
?>

似乎什么都没用！我有什么遗漏吗？

如果有必要，我正在运行WordPress 5.8.1版。

相关推荐