ASP.NET核心.Bower依赖项不会复制到wwwroot

Question

我有一个ASP.Core项目(Visual Studio 2015),我通过'Manage Bower packages'为它安装了bootstrap

我在项目依赖项中看到了包

但是wwwroot是空的,我无法从我的视图中访问js和css文件.

有什么想法吗？

Answer 1

您应该使用:bower设置文件或gulp或webpack等处理器:

选项1:Bower配置

docs:https://bower.io/docs/config/

简而言之.你可以创建一个.bowerrc文件{ directory": "wwwroot/bower_components" }.

现在,如果bower install您是依赖项,它会将它们添加到wwwroot/bower_components中.

对于大型,SEO相关的项目选项2优先:

选项2:处理

在将文件添加到wwwroot之前,您可以使用gulp等工具来缩小文件.

它增加了额外的步骤/复杂性.但优点是较小的文件(缩小)+你只复制你需要的东西,导致较小的已发布包.

在gulpfile.js你可以做这样的事情:

var gulp = require('gulp');
var bower = require("./bower.json");
gulp.task("copy", function() {
  var resources = bower.webResources;
  var tasks = resources.map(function(resource) {
    return gulp.src("./bower_components/" + resource)
    .pipe(gulp.dest('./wwwroot/lib/')); //copy globpath to wwwroot/lib
  });
  return merge(tasks);
});

然后你可以在你的bower.json中添加一个webResources列表来定义需要复制的内容:

"webResources": [ //bootstrap example, with globbing
  "bootstrap/dist/**/@(bootstrap.css|glyphicons-halflings-regular.*|bootstrap.js)",
]

建议使用Webpack2

您可以使用webpack2将所有Web依赖项:Javascript,css,fonts,images合并到一个javascript文件中.

缺点:*它会增加构建时间,因为webpack现在也必须编译.(Pro:您可以使用devserver按需构建).*Delta更新效率会降低

Pro:*你得到一个单独的文件作为依赖*你可以使用最新的javascript/typescript功能和transile&shim,所以它适用于每个浏览器.

Answer 2

正如经常发生的那样，发布此问题后不久就发现了问题。也许这对某人有用。

快速回答：手动将Bower.json添加到您的项目中，然后添加依赖项。

长答案：单击“显示所有文件”后，没有文件“bower.js”。我将其添加到项目的“添加新项目”中

并添加了这段代码

{
    "name": "asp.net",
    "private": true,
     "dependencies": {
       "bootstrap": "3.3.7",
       "jquery": "3.1.1"
    }
}

重新加载并将包复制到 wwwroot 后