Saya memberi Anda dua jawaban. npm yang dikombinasikan dengan alat lain sangat berguna tetapi membutuhkan beberapa pekerjaan untuk menyiapkannya. Jika Anda hanya ingin mengunduh beberapa perpustakaan, Anda mungkin ingin menggunakan Manajer Perpustakaan sebagai gantinya (dirilis dalam Visual Studio 15.8).
NPM (Lanjutan)
Pertama tambahkan package.json di root proyek Anda. Tambahkan konten berikut:
{
"version": "1.0.0",
"name": "asp.net",
"private": true,
"devDependencies": {
"gulp": "3.9.1",
"del": "3.0.0"
},
"dependencies": {
"jquery": "3.3.1",
"jquery-validation": "1.17.0",
"jquery-validation-unobtrusive": "3.2.10",
"bootstrap": "3.3.7"
}
}
Ini akan membuat NPM mengunduh Bootstrap, JQuery, dan pustaka lain yang digunakan dalam proyek inti asp.net baru ke folder bernama node_modules. Langkah selanjutnya adalah menyalin file ke tempat yang sesuai. Untuk melakukan ini kita akan menggunakan gulp, yang juga diunduh oleh NPM. Kemudian tambahkan file baru di root proyek Anda bernama gulpfile.js . Tambahkan konten berikut:
/// <binding AfterBuild='default' Clean='clean' />
/*
This file is the main entry point for defining Gulp tasks and using Gulp plugins.
Click here to learn more. http://go.microsoft.com/fwlink/?LinkId=518007
*/
var gulp = require('gulp');
var del = require('del');
var nodeRoot = './node_modules/';
var targetPath = './wwwroot/lib/';
gulp.task('clean', function () {
return del([targetPath + '/**/*']);
});
gulp.task('default', function () {
gulp.src(nodeRoot + "bootstrap/dist/js/*").pipe(gulp.dest(targetPath + "/bootstrap/dist/js"));
gulp.src(nodeRoot + "bootstrap/dist/css/*").pipe(gulp.dest(targetPath + "/bootstrap/dist/css"));
gulp.src(nodeRoot + "bootstrap/dist/fonts/*").pipe(gulp.dest(targetPath + "/bootstrap/dist/fonts"));
gulp.src(nodeRoot + "jquery/dist/jquery.js").pipe(gulp.dest(targetPath + "/jquery/dist"));
gulp.src(nodeRoot + "jquery/dist/jquery.min.js").pipe(gulp.dest(targetPath + "/jquery/dist"));
gulp.src(nodeRoot + "jquery/dist/jquery.min.map").pipe(gulp.dest(targetPath + "/jquery/dist"));
gulp.src(nodeRoot + "jquery-validation/dist/*.js").pipe(gulp.dest(targetPath + "/jquery-validation/dist"));
gulp.src(nodeRoot + "jquery-validation-unobtrusive/dist/*.js").pipe(gulp.dest(targetPath + "/jquery-validation-unobtrusive"));
});
File ini berisi kode JavaScript yang dijalankan saat proyek dibangun dan dibersihkan. Ini akan menyalin semua file yang diperlukan ke lib2 ( bukan lib - Anda dapat dengan mudah mengubahnya ). Saya telah menggunakan struktur yang sama seperti di proyek baru, tetapi mudah untuk mengubah file ke lokasi yang berbeda. Jika Anda memindahkan file, pastikan Anda juga memperbarui _Layout.cshtml . Perhatikan bahwa semua file dalam direktori lib2 akan dihapus saat proyek dibersihkan.
Jika Anda mengklik kanan gulpfile.js , Anda dapat memilih Task Runner Explorer . Dari sini Anda dapat menjalankan gulp secara manual untuk menyalin atau membersihkan file.
Gulp juga bisa berguna untuk tugas lain seperti mengecilkan JavaScript dan file CSS:
https://docs.microsoft.com/en-us/aspnet/core/client-side/using-gulp?view=aspnetcore-2.1
Manajer Perpustakaan (Sederhana)
Klik kanan pada proyek Anda dan pilih Kelola perpustakaan sisi klien . File libman.json sekarang terbuka. Dalam file ini Anda menentukan pustaka dan file mana yang akan digunakan dan di mana mereka harus disimpan secara lokal. Sangat sederhana! Berkas berikut ini menyalin pustaka default yang digunakan saat membuat proyek ASP.NET Core 2.1 baru:
{
"version": "1.0",
"defaultProvider": "cdnjs",
"libraries": [
{
"library": "jquery@3.3.1",
"files": [ "jquery.js", "jquery.min.map", "jquery.min.js" ],
"destination": "wwwroot/lib/jquery/dist/"
},
{
"library": "jquery-validate@1.17.0",
"files": [ "additional-methods.js", "additional-methods.min.js", "jquery.validate.js", "jquery.validate.min.js" ],
"destination": "wwwroot/lib/jquery-validation/dist/"
},
{
"library": "jquery-validation-unobtrusive@3.2.10",
"files": [ "jquery.validate.unobtrusive.js", "jquery.validate.unobtrusive.min.js" ],
"destination": "wwwroot/lib/jquery-validation-unobtrusive/"
},
{
"library": "twitter-bootstrap@3.3.7",
"files": [
"css/bootstrap.css",
"css/bootstrap.css.map",
"css/bootstrap.min.css",
"css/bootstrap.min.css.map",
"css/bootstrap-theme.css",
"css/bootstrap-theme.css.map",
"css/bootstrap-theme.min.css",
"css/bootstrap-theme.min.css.map",
"fonts/glyphicons-halflings-regular.eot",
"fonts/glyphicons-halflings-regular.svg",
"fonts/glyphicons-halflings-regular.ttf",
"fonts/glyphicons-halflings-regular.woff",
"fonts/glyphicons-halflings-regular.woff2",
"js/bootstrap.js",
"js/bootstrap.min.js",
"js/npm.js"
],
"destination": "wwwroot/lib/bootstrap/dist"
},
{
"library": "list.js@1.5.0",
"files": [ "list.js", "list.min.js" ],
"destination": "wwwroot/lib/listjs"
}
]
}
Jika Anda memindahkan file, pastikan Anda juga memperbarui _Layout.cshtml .
