如何从asp.net vnext项目中的wwwroot访问node_modules文件夹

Question

如何从我的index.html所在的wwwroot访问visual studio解决方案文件中未包含的node_modules文件夹.那个index.html文件需要引用像angular.js这样的npm安装包.

但是怎么样？

我不想将整个node_modules文件夹复制到wwwroot中.那些不是那里的文件......

我不想将node_modules文件夹包含在解决方案中,因为这会减慢所有内容并挂断...

似乎Frontend开发不属于VS ......

Answer 1

至少有两个明智的选择:

• 使用提供其他文件夹app.UseStaticFiles.最初的解决方案是从Ode到Code.我用它进行开发,因为Visual Studio似乎并不尊重本地 .npmrc文件的设置prefix = wwwroot/node_modules.理想情况下, node_modules应捆绑生产.有npm汇总插件可以使用import功能自动捆绑脚本 (ES2015).

• 从CDN服务node_modules(例如unpkg.com).这很简单,唯一的缺点是CDN的响应时间,特别是如果您为了开发目的而禁用了浏览器缓存.

以下是在ASP.NET Core中提供文件夹的代码.您只需要更改Startup类:

public void Configure(IApplicationBuilder app, IHostingEnvironment env, ILoggerFactory loggerFactory)
{
    ...some other stuff

    if (env.IsDevelopment())
    {
        ServeFromDirectory(app, env, "node_modules");
    }
}

public void ServeFromDirectory(IApplicationBuilder app, IHostingEnvironment env, string path)
{
    app.UseStaticFiles(new StaticFileOptions
    {
        FileProvider = new PhysicalFileProvider(
            Path.Combine(env.ContentRootPath, path)
        ),
        RequestPath = "/" + path
    });
}

Answer 2

你不应该从外面访问文件wwwroot.该wwwroot文件夹是您在托管时可从外部访问的公用文件夹.

它上面的一切都是禁区.

典型的发布过程是,您在编译或发布ASP.NET webproject时运行的gulp或grunt任务,它将在那里运行任务并复制文件wwwroot夹内的必要文件,即wwwroot/libs或wwwdata/js.

当然,您也可以手动复制文件,但这相当糟糕,尤其是当您更新许多依赖项时,很难手动跟踪.

虽然它没有显示在解决方案中(只是间接地,在本Dependencies/npm节中),但您仍然可以通过点击解决方案资源管理器顶部的"显示所有文件"按钮并将其复制到所需文件来使其可见.

但最好为它设置一个gulp任务,但这超出了这个问题的范围.