Issue with LeptonX CSS and JS Bundles after Upgrade to ABP.io 9 #9795

2 Answer(s)

• 

  0

  AI-Bot created 2 months ago

  Support Team ABP Agent

  • After upgrading to ABP 9, you must update your bundling configuration to use the new Global Assets system introduced in ABP 9. The previous approach to bundling (used in ABP 7) is not compatible with the new system, and manual steps are required to ensure the latest LeptonX CSS and JS bundles are loaded, especially in development mode.

  Required Steps:

  1. Update Bundling Configuration:
     • Remove any old bundle contributor classes and manual global.js/global.css files.
     • In your module, configure the new bundling system using AbpBundlingOptions and add your contributors for LeptonX:

  [DependsOn(
           typeof(AbpAspNetCoreMvcUiBundlingModule),
           typeof(AbpAspNetCoreMvcUiLeptonXThemeBundlingModule)
       )]
       public class YourWebModule : AbpModule
       {
           public override void ConfigureServices(ServiceConfigurationContext context)
           {
               Configure<AbpBundlingOptions>(options =>
               {
                   options.StyleBundles.Get(MvcLeptonXThemeBundles.Styles.Global)
                       .AddContributors(typeof(YourStyleBundleContributor));
                   options.ScriptBundles.Get(MvcLeptonXThemeBundles.Scripts.Global)
                       .AddContributors(typeof(YourScriptBundleContributor));
               });
           }
       }
  

  2. Use MapAbpStaticAssets:

     • In your Startup.cs or module initialization, replace app.UseStaticFiles() with app.MapAbpStaticAssets() to ensure virtual files (including LeptonX assets) are served correctly in .NET 9.

  3. Remove Old Bundling Artifacts:

     • Delete any global.js or global.css files from your wwwroot if they were previously generated.
     • Remove the AbpCli:Bundle section from your appsettings.json.

  4. Ensure Correct NuGet Packages:

     • Reference the latest LeptonX theme bundling package:

  <PackageReference Include="Volo.Abp.AspNetCore.Mvc.UI.Theme.LeptonX.Bundling" Version="9.0.0" />
  

  • Also, ensure you have the correct version of Volo.Abp.AspNetCore.Mvc.UI.Bundling.

  5. Development Mode:

     • The new bundling system automatically serves the latest files in development mode. No manual bundle regeneration is needed.

  6. Check for Additional Module Bundling:

     • If you use other ABP commercial modules, add their corresponding bundling modules as dependencies.

  Summary:
  You must migrate your bundling configuration to the new Global Assets system, update your module dependencies, and use MapAbpStaticAssets for static file serving. This ensures the latest LeptonX bundles are loaded in ABP 9, including in development mode.

  Sources:

  • ABP 9.0 Migration Guide
  • LeptonX Theme for MVC
  • ABP Global Assets & Bundling

  ---

  This response was generated by AI. If it didn’t solve your problem, feel free to post a new answer — our support team will jump in to help you soon.

  Save Cancel
• 

  0

  maliming created 2 months ago

  Support Team Fullstack Developer

  hi

  Can you share a project to show the problem?

  liming.ma@volosoft.com Thanks.

  Save Cancel