在撇号cms中使用第三方jQuery插件

在我的撇号cms我有这样的头（在outerLayout.html文件中）的一部分：

<div id="sticky-header"> ... </div> 

在页脚中，我做了以下工作：

 <script src="/thirdparty/jquery/jquery-3.2.1.min.js"></script> <script src="/thirdparty/sticky/jquery.sticky.js"></script> 

我明白，撇号以某种方式包括jQuery，但如果我不自己包括它，我在控制台中得到一个错误：

 jquery.sticky.js:22 Uncaught ReferenceError: jQuery is not defined at jquery.sticky.js:22 at jquery.sticky.js:24 

我在always.js文件中也有以下内容

 $("#sticky-header").sticky({ topSpacing:0, zIndex:1000 }); 

这会产生错误：

 always.js:109 Uncaught TypeError: $(...).sticky is not a function at always.js:109 

我该如何解决这个问题？

Answer 1

在你的情况下，你需要推送你自己的jQuery副本的原因是，包括来自outerLayout文件正在运行前端的JavaScript前端的前端资产pipe道。

要包含您的第三方/自定义JavaScript INSIDE Apostrophe的资产pipe道（这是推荐和jQuery最初运行的位置），您需要从一个撇号模块推送JavaScript文件。

最快捷的方法就是将资产从apostrophe-assets模块中提取出来，该模块应该已经存在于您的项目中。

在app.js

 ... 'apostrophe-assets': { scripts: [ { name: 'yourFile' } ] }, ... 

这将加载lib/modules/apostrophe-assets/public/js/yourFile.js

更多关于推送资产浏览器在这里http://apostrophecms.org/docs/tutorials/getting-started/pushing-assets.html

在这个过程中，您可能希望通过适当的模块来组织前端资源，而不是将它们全部推入堆中，这将是一个很好的参考http://apostrophecms.org/docs/tutorials/getting-started/custom-widgets的.html＃添加-A-Java的脚本插件，播放器上的浏览器端

此外，你可以期待在那里，当你推JavaScript的http://apostrophecms.org/docs/tutorials/getting-started/custom-widgets.html#what-39-s-available-in-the-browser

Answer 2

感谢很多斯图尔特 – 这绝对推动我在正确的方向:)

然而，我最终做的工作是首先把文件放在lib/modules/apostrophe-assets/public/js/像你所build议的，然后编辑lib/modules/apostrophe-assets/index.js文件：

 module.exports = { stylesheets: [ { name: 'site' } ], scripts: [ { name: 'bootstrap/js/bootstrap.min' }, { name: 'sticky/jquery.sticky' }, { name: 'scrollto/jquery.scrollTo.min' } ] };