配置 Node Express 来服务静态 Bower_Components?

2024-03-10

我有一个目录结构

projectName
    | - bower_components/
    | - public/
        | - css
        | - js
        | - index.html
    | - Gruntfile.js
    | - package.json
    | - bower.json
    | - app.js

我想启动我的应用程序并提供服务index.html与节点。所以在app.js I have:

var express = require('express');
var port = process.env.PORT || 3000;
var app = express();

app.configure(function(){
    // Serve up content from public directory
    app.use(express.static(__dirname + '/public'));
    app.use(app.router);
    app.use(express.logger()); 
});

app.listen(port, function(){
    console.log('Express server listening on port ' + port);
});

在底部index.html I have:

<script src="../bower_components/jquery/jquery.js"></script>
<script src="../bower_components/d3/d3.js"></script>
<script src="../bower_components/bootstrap/dist/js/bootstrap.js"></script>
<script src="bower_components/spin.js/spin.js"></script>
<script src="bower_components/mustache/mustache.js"></script>

当我启动服务器时,index.html显示但以上库均未加载。我收到错误(404):

GET http://localhost:3000/bower_components/jquery/jquery.js 404 (Not Found) localhost/:32
GET http://localhost:3000/bower_components/d3/d3.js 404 (Not Found) localhost/:33
GET http://localhost:3000/bower_components/bootstrap/dist/js/bootstrap.js 404 (Not Found) localhost/:34
GET http://localhost:3000/bower_components/spin.js/spin.js 404 (Not Found) localhost/:35
GET http://localhost:3000/bower_components/mustache/mustache.js 404 (Not Found) 

如何从 Bower_components 提供文件?


我使用这个设置:

app.use(express.static(__dirname + '/public'));
app.use('/bower_components',  express.static(__dirname + '/bower_components'));

所以任何 Bower 组件都是从 HTML 加载的,如下所示:

<script src="/bower_components/..."></script>

以及任何其他客户端 JS/CSS(在public/) 的加载方式如下:

<script src="/js/..."></script>
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

配置 Node Express 来服务静态 Bower_Components? 的相关文章

  • Chrome 扩展程序可以相互通信吗?

    我正在编写一个Chrome扩展程序 并且想要实现一个接口或api 以便我将来制作的其他扩展程序可以使用它 最终的效果可能如下 分机 B 呼叫extensionA someMethod someParameters 并向分机A发送一些数据 分
  • HTML 和 标签有什么区别?

    HEAD 标签和 BODY 标签有什么区别 大多数 HTML 书籍仅 简短 提及 and 标签 但它们消失得很快 它们会影响浏览器呈现网页的方式吗 另外 它们会影响 javascript 的运行顺序吗 我的意思是 如果我里面有一个javas
  • 有什么方法可以复制 div 的渲染 HTML 吗?

    我正在开发电子邮件签名生成器 我想通过按按钮复制最终签名 而不是手动选择签名并将其复制到剪贴板 这意味着我需要它们的图像 文本和样式 我尝试了几种变体 包括 w3schools 的变体 但没有成功 其中一些只是复制文本 但没有样式 例子 h
  • jQuery 可以操作插入的元素吗?

    我是 jQuery 的新手 我认为 jQuery 可以操作由代码添加的元素是合理的 但我发现现在还不能 function addVideo click function publisher append div div
  • Visual Studio 改变 Ctrl-K-D 的工作方式

    In Visual Studio I m using 2012 is there any way of editing the way that Ctrl K D combinations handles its Auto Formatti
  • Pjax动画

    我终于让 pjax 工作了 但我还有另一个问题 如何添加一些 jquery 动画 如淡出 幻灯片旧内容和淡入 幻灯片新内容 默认情况下 pjax 只是更改内容 没有任何好看的效果 任何帮助将非常感激 此致 基本上 你有一堆事件 https
  • 如何设置必须输入特定数字的字段?

    我想知道如何创建一个需要输入特定数字或文本的字段 例如 激活码 以及在输入的确认答案的情况下移动到 网页 并且在未确认的情况下移动到 另一页面 的按钮 使用必需的属性
  • Javascript:我应该隐藏我的实现吗?

    作为一名 C 程序员 我有一个习惯 将可以而且应该私有的东西设为私有 当 JS 类型向我公开其所有私有部分时 我总是有一种奇怪的感觉 而且这种感觉并没有被 唤起 假设我有一个类型draw方法 内部调用drawBackground and d
  • Node 不断恢复到旧版本

    每次我在控制台中重新启动 vagrant 时 它都会询问我的登录详细信息 然后说Now using node v7 10 0 npm v4 2 0 当我做run nvm install node I get v13 11 0 is alre
  • Rangy:插入符号下的单词(再次)

    我正在尝试创建一个预输入代码以添加到 wysihtml5 富文本编辑器 基本上 我需要能够插入人员 标签引用 例如 Twitter Github Facebook 我发现一些人试图实现同样的事情的代码 http jsfiddle net A
  • 非法使用break语句; javascript

    当这个变量达到一定数量时 我希望循环停止 但我不断收到错误 未捕获的语法错误 非法的中断语句 function loop if isPlaying jet1 draw drawAllEnemies requestAnimFrame loop
  • 如何按 Angular 表中的属性(该属性具有单个 rownspan)进行分组?

    我没有找到这个问题的合适标题 我的问题是 例如 我有一个包含两列的表 列汽车品牌和列汽车型号 我希望表是 like in this picture 换句话说 品牌名称只会出现 1 次 我的输入数组采用以下 json 格式 brand Aud
  • Riak 在 MapReduce 查询中失败。使用哪种配置?

    我正在与 riak riak js 结合开发一个 nodejs 应用程序 并遇到以下问题 运行此请求 db mapreduce add logs run 正确返回存储在存储桶日志中的所有 155 000 个项目及其 ID logs 1GXt
  • 嵌套 DIV 的类似斑马的 CSS 样式

    我嵌套了 DIV 元素 但我不知道嵌套的级别 我需要每个都有与其父级不同的背景 创建类似斑马的颜色 我只使用两种背景 深色和白色 效果需要类似于在容器中设置奇数和偶数子级的样式 但在我的例子中 子级是嵌套的 我可以使用每个嵌套元素的规则来做
  • jQuery 中什么函数相当于 .SelectMany()?

    让我解释一下 我们知道 jQuery 中的映射函数充当 Select 如 LINQ 中 tr map function return this children first returns 20 tds 现在的问题是我们如何在 jQuery
  • Angularjs : $locationProvider.hashPrefix("!") ;

    我想将网址显示为 www test com 因为我正在使用 locationProvider hashPrefix 但它显示网址为 www test com 我想 哈希之前而不是哈希之后 Thanks var app angular mod
  • for循环中需要声明变量吗?

    有什么区别 for var i 0 i lt 5 i for i 0 i lt 5 i 是否有必要包含 var 关键字 我知道 var 关键字会影响变量范围 但我无法理解是否有必要在 for 循环中包含该关键字 在第二个示例中 您的变量是全
  • 使用 ng-if 改变角度方向

    我想通过单击将方向从 rtl 更改为 ltr and in 设置 html
  • 绘制多边形

    我正在使用 Google Maps API V3 根据路径绘制多边形 该路径是随机未排序坐标点 LatLng 的数组 这会产生以下形状 Polylines intersect Problem 由于多边形的形状取决于路径中点的顺序 因此如何对
  • Keycloak-js updateToken(minValidity) 需要澄清

    我在Keycloak js中阅读了很多该方法的示例 但没有对以下方法进行明确的解释 updateToken minValidity number KeycloakPromise

随机推荐

  • Backbone.js 视图的合适粒度是多少?

    我正在采用 Backbone js 来渲染一个小角落现有的大型网络应用程序 http www esvonline org 如果进展顺利 我可以看到 Backbone js 不断发展以涵盖整个应用程序 为有机增长的应用程序提供一些急需的结构
  • 了解Scheme函数

    我们的编程语言练习考试中给出了以下问题 我很难理解它是如何工作的 有人能告诉我代码流程是什么吗 我已经在球拍中运行过它并且知道答案是什么 看起来第一个 lambda 函数将其他两个函数作为参数 但输入在哪里 lambda x 2 and l
  • 在 C 中创建字符串的宏

    替代标题 以帮助搜索 将预处理器标记转换为字符串 我怎样才能从一个字符串C宏的价值 原始问题 我想用C define在编译时构建文字字符串 该字符串是因调试 发布等而更改的域 我想做这样的事情 ifdef TESTING define IV
  • 是否有 Perl 模块可以连接 Google Contacts API?

    我想编写一个命令行程序来将联系人添加到 GoogleMail WWW 联系方式 Google联系方式 http search cpan org dist WWW Contact GoogleContactsAPI似乎只能从 Google 获
  • 多核机器上 .NET 操作的非线性扩展

    我在 NET 应用程序中遇到了一种奇怪的行为 该应用程序对一组内存数据执行一些高度并行的处理 当在多核处理器 IntelCore2 Quad Q6600 2 4GHz 上运行时 它会在启动多个线程来处理数据时表现出非线性扩展 当在单核上作为
  • Wix升级:预选功能

    我们使用 Wix 来创建我们的安装程序 我们使用的用户界面可以选择需要安装的功能 某些功能默认启用 其他功能则禁用 但是 当我们运行升级时 这些默认值将被保留 我们希望安装程序记住安装了哪些功能 并在功能树中启用它们以进行升级 应禁用所有其
  • Railsinstaller 遇到问题

    我在 Windows 8 笔记本电脑上遇到了 Railsinstaller 问题 这是由于无法使用以下命令在 项目 目录中运行服务器rails s命令 但是与许多教程相反 我每次都会收到这个命令 C Sites demo gt rails
  • 商业产品中的 JavaFX [关闭]

    Closed 这个问题是无关 help closed questions 目前不接受答案 我想使用 JavaFX 作为大型商业产品的开发框架 我可以在不违反 Oracle 许可的情况下关闭未来产品的源代码并使用 Oracle JavaFX
  • 我想显示第一个列表中的第一个单词并显示第二个列表中的 10 个单词,依此类推-python。我尝试使用 range 和 zip。它仍然不起作用

    在这里 我正在创建一个名为 li 的列表 其中包含标签文本和名为 list2 的列表 其中包含 span 文本 我使用 zip 附加它 现在 我有一个名为 name 的第三个列表 它有 2 个值 最活跃者 增益者 我想要 Mostactiv
  • 在 dataclasses.field 中使用显式 __init__ 构造函数和 default_factory 参数时,数据类属性丢失

    以下代码创建一个数据类Obj带有 int 字段n默认值为 0 from dataclasses import dataclass field dataclass class Obj n int field default factory i
  • scala:匹配对象的类型参数

    例如 如果我有一个接受 Type 参数的类Seq T 我有很多此类的对象 我想根据类型参数拆分它们T 例如 val x List Seq Int 1 2 3 4 5 6 7 8 9 0 Seq String a b c x foreach
  • 错误:管道的另一端没有进程

    我正在使用 SQL Server 2012 仅限本地主机 和 SQL Server Management Studio SSMS 来查看包含二进制值 图片 的表图片 大小为 928 行 大小并不大 只有那张桌子有问题 即使在重新启动 SQL
  • 如何在DataGridViewTextBoxCell和DataGridViewComboBoxCell之间切换?

    我想要一个有两列的 DataGridView 第一列始终为 DataGridViewComboBoxColumn 类型 根据该列中的选择 我希望能够将第二列中的相应单元格更改为 DataGridViewComboBoxCell 或 Data
  • CQRS、DDD同步报告数据库

    我们正在尝试 CQRS 和 DDD 以及事件溯源 假设我有一位客户更新了电子邮件地址 这会触发 CustomerUpdatesEmailAddress 事件 这会进入我的操作 写入数据库 并更新表 我们的系统设计为有一个运行的 ETL 流程
  • 有没有办法在 F# 中通过字符串获取记录字段?

    我想通过用字符串查找来获取记录中字段的值 type Test example string let test example this is the value let getByName s string something like t
  • 使用 pd.concat 时添加标识原始数据框的列

    我有一个数据框字典 如下所示 test df1 pd DataFrame col1 3 5 1 4 col2 3 5 1 4 df2 pd DataFrame col1 3 5 1 4 col2 3 5 1 4 df3 pd DataFra
  • lit-element Web Components 和 React 之间的主要区别[关闭]

    Closed 此问题正在寻求书籍 工具 软件库等的推荐 不满足堆栈溢出指南 help closed questions 目前不接受答案 查看 React 代码 它似乎与 Lit Element 代码更相似 两者都可以用于创建 Web 组件
  • nullptr_t 是默认的可构造类型吗?

    我无法从 C 11 标准判断 nullptr t 是否有默认构造函数 换句话说 以下内容有效吗 nullptr t n GCC 和 VC 允许上述代码 但 clang 不允许 我在标准中找不到任何内容指定它没有默认构造函数 而我能找到的内容
  • 在html文件Flutter中使用js文件

    如何在 Flutter 中使用与 html 关联的 js 文件 我使用 webview flutter 插件加载index html文件并且它可以工作 但是我无法加载js文件 这是我的颤振代码 return Scaffold appBar
  • 配置 Node Express 来服务静态 Bower_Components?

    我有一个目录结构 projectName bower components public css js index html Gruntfile js package json bower json app js 我想启动我的应用程序并提供