Search code examples
orchardcms

Orchard Core - failed to load resources

I am trying to create my own theme for Orchard Core based on bootstrap but it fails to load all of the resources, whether it's javascript or styles.

This is my layout.liquid view

<!doctype html>
<html class="no-js" lang="zxx">
  <head>
    <meta charset="utf-8">
    <meta http-equiv="x-ua-compatible" content="ie=edge">
    <title>Fiction Multipage Bootstrap Template</title>
    <meta name="description" content="">
    <meta name="viewport" content="width=device-width, initial-scale=1">

    <link rel="apple-touch-icon" href="apple-touch-icon.png">
    <!-- Place favicon.ico in the root directory -->

    <link rel="stylesheet" href="wwwroot/plugins/bootstrap/bootstrap.min.css">
    <!-- ThemeFisher Icon -->
    <link rel="stylesheet" href="wwwroot/plugins/themefisher-fonts/themefisher-fonts.css">
    <!-- Light Box -->
    <link rel="stylesheet" href="wwwroot/plugins/magnific-popup/magnific-popup.css">
    <!-- animation css -->
    <link rel="stylesheet" href="wwwroot/plugins/animate/animate.css">
    <!-- slick slider -->
    <link rel="stylesheet" href="wwwroot/plugins/slick/slick.css">

    <!-- Revolution Slider -->
    <link rel="stylesheet" href="wwwroot/css/style.css">

    <style>
      /* Always set the map height explicitly to define the size of the div
       * element that contains the map. */
      #map_canvas {
        height: 100%;
      }
      /* Optional: Makes the sample page fill the window. */
    </style>
    <script src="wwwroot/plugins/modernizr.min.js"></script>
  </head>

//body here

 <script src="wwwroot/plugins/jquery.min.js"></script>

    <script src="wwwroot/plugins/bootstrap/bootstrap.min.js"></script>
    <!-- slick slider -->
    <script src="wwwroot/plugins/slick/slick.min.js"></script>
    <!-- filter -->
    <script src="wwwroot/plugins/filterizr/jquery.filterizr.min.js"></script>
    <!-- Lightbox -->
    <script src="wwwroot/plugins/magnific-popup/jquery.magnific-popup.min.js"></script>
    <!-- Parallax -->
    <script src="wwwroot/plugins/parallax.min.js"></script>
    <!-- Video -->
    <script src="wwwroot/plugins/jquery.vide.js"></script>
    <!-- google map -->
    <script src="https://maps.googleapis.com/maps/api/js?key=AIzaSyBu5nZKbeK-WHQ70oqOWo-_4VmwOwKP9YQ"></script>
    <script src="wwwroot/plugins/google-map/gmap.js"></script>

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

My ResourceManifest is like so

using Microsoft.Extensions.Options;
using OrchardCore.ResourceManagement;

namespace PakomakTheme
{
    public class ResourceManagementOptionsConfiguration : IConfigureOptions<ResourceManagementOptions>
    {
        private static ResourceManifest _manifest;

        static ResourceManagementOptionsConfiguration()
        {
            _manifest = new ResourceManifest();

            _manifest
                .DefineScript("PakomakTheme-bootstrap-bundle")
                .SetCdn("https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.bundle.min.js", "https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.bundle.js")
                .SetCdnIntegrity("sha384-ka7Sk0Gln4gmtz2MlQnikT1wXgYsOg+OMhuP+IlRH9sENBO0LRn5q+8nbTov4+1p", "sha384-8fq7CZc5BnER+jVlJI2Jafpbn4A9320TKhNJfYP33nneHep7sUg/OD30x7fK09pS")
                .SetVersion("5.1.3");

            _manifest
                .DefineScript("PakomakTheme")
                .SetUrl("~/wwwroot/js/scripts.min.js", "~/wwwroot/js/scripts.js")
                .SetVersion("7.0.10");

            _manifest
                .DefineStyle("PakomakTheme")
                .SetUrl("~/wwwroot/css/style.min.css", "~/wwwroot/css/style.css")
                // i also tried like so
                //.SetUrl("~/PakomakTheme/wwwroot/css/style.min.css", "~/PakomakTheme/wwwroot/css/style.css")
                .SetVersion("7.0.10");

            _manifest
                .DefineStyle("PakomakTheme-bootstrap-oc")
                .SetDependencies("PakomakTheme")
                .SetUrl("~/Assets/src/scss/bootstrap-oc.min.css", "~/Assets/src/scss/bootstrap-oc.css")
                .SetVersion("1.0.0");
        }

        public void Configure(ResourceManagementOptions options)
        {
            options.ResourceManifests.Add(_manifest);
        }
    }
}

and this is what my project hierarchy

enter image description here

Any ideas what the problem could be?

Solution

  • Remove wwwroot from your url. Instead of following

    .SetUrl("~/wwwroot/js/scripts.min.js", "~/wwwroot/js/scripts.js")

    Change to

     .SetUrl("~/js/scripts.min.js", "~/js/scripts.js")