How do I include JavaScript packages I install from Nuget?

Possibly a stupid question. I installed Chart.js using package manager. It's in Solution explorer.

enter image description here

But where are the actual JS files or how do I get them? When I installed it, there are no changes that Git detects, so I'm not sure if anything at all happened.

Answers:

Answer

Chart.js 2.5.0 includes a Content\Scripts directory inside its NuGet package which contains a Chart.js and Chart.min.js. Depending on what sort of project you are using these files may or may not be added directly into your project.

If you are using a .NET Framework project that has a packages.config file then the JavaScript files will be added into a Scripts folder into your project.

If you are using a project.json file, or your project uses PackageReferences, then nothing will be added since this sort of project only supports files that are in a contentFiles directory inside the NuGet package. Your project looks like a .NET Core project which will use PackageReferences. The Chart.js NuGet package itself will be in the %UserProfile%\.nuget\packages directory if you need to get the javascript files.

Tseng's answer that recommends switching to using Bower or the Node Package Manager to add the JavaScript files seems like the best solution here instead of using NuGet, which does not have good support for adding source files to your project for newer project file formats.

Answer

The usage of NuGet for css/javascript libraries is discouraged. For ASP.NET Core you should use the java script / node package managers, bower and npm respectively.

You can use either one. Bower is more focused on browser libraries and css, while NPM is more for server-sided stuff (using node.js). But node.js also contains most (if not all) of the packages bower has, so it's matter of preference.# For that, you need to select your MVC project and add a new file to the project root. While in the template manager (Add->New File...), search for "Bower Configuration File" or "npm Configuration file".

Then edit the file and add your dependency, i.e.

package.json (npm)

{
    "dependencies:" {
        "chart.js": "2.5.0"
    }
}

Once you save, the file will be downloaded in a directory named "node_modules`. This alone won't be enough, as the required files need to be copied over to wwwroot folder, where they can be accessed when the application runs.

For this you'd need either use the bundler to bundle the files together (should be in default ASP.NET Core project template) or use task runners such as Gulp or Grunt to run tasks on build/publishing, which does that for you. See ASP.NET Core Docs on Gulp examples.

Update

Bower been deprecated now for over a year.

Tags

Recent Questions

Top Questions

Home Tags Terms of Service Privacy Policy DMCA Contact Us

©2020 All rights reserved.