Q: MVC: include jsvascript as module

[leonkosak]

For MVC project, how to properlja import devextreme-aspnet-data-nojquery library inside abp.resourcemapping.js and initialized in .cshtml?
Error in javascript console: Uncaught This script should be used with an AMD or CommonJS loader

I know that MVC project includes jQuery, but I prefer not using if possible.
Thank you.

[maliming]

hi

You can create a new npm package and a ScriptContributor in your module.

package.json

{
  "version": "1.0.0",
  "name": "yourmodulename/devextreme-aspnet-data-nojquery",
  "publishConfig": {
    "access": "public"
  },
  "dependencies": {
    "@abp/core": "~9.0.2",
    "devextreme-aspnet-data-nojquery": "~5.0.0"
  }
  //...
}

abp.resourcemapping.js

module.exports = {
    mappings: {
        "@node_modules/devextreme-aspnet-data-nojquery/*.*": "@libs/yourmodulename/devextreme-aspnet-data-nojquery/"
    }
}

[DependsOn(typeof(CoreScriptContributor))]
public class YourModuleNameDevextremeScriptContributor : BundleContributor
{
    public override void ConfigureBundle(BundleConfigurationContext context)
    {
        context.Files.AddIfNotContains("/libs/yourmodulename/devextreme-aspnet-data-nojquery/index.js");
    }
}

---

Add your npm package to package.json of your host/app project.

Run the abp install-libs command. The Devextreme js will/should copy to the libs folder.

See:

https://github.com/abpframework/abp/tree/dev/npm/packs/signalr
https://github.com/abpframework/abp/blob/dev/framework/src/Volo.Abp.AspNetCore.Mvc.UI.Packages/Volo/Abp/AspNetCore/Mvc/UI/Packages/SignalR/SignalRBrowserScriptContributor.cs#L8-L15

[leonkosak]

I'll try @maliming.
What about adding this library in package.json inside abp solution along @volo packages? Is creating custom npm package and publishing to npm really necessary?

[maliming]

If the devextreme-aspnet-data-nojquery is popular, we can add it as an abp npm package.