繁体   English   中英

MeteorJS外部文件:css和js

[英]MeteorJS external files: css and js

我正在尝试将此Bootstrap主题添加到我的项目中http://ironsummitmedia.github.io/startbootstrap-creative/这个主题在jquery和bootstrap旁边有4个js文件。

我将jquery和bootstrap添加到了我的项目中,正如Metereor doc所说,这4个文件位于兼容性文件夹中,但是没有用。 向下滚动页面时的导航栏效果不起作用,有时(如果我保持.js文件名不变),我会遇到关于fitText.js文件的错误。

PD1:兼容性文件夹按字母顺序加载.js文件。

PD2:我在堆栈和流星论坛中尝试了很多发现的建议,但没有任何反应。

我把css和更少的文件放在client / lib / stylesheet中,它们看起来还可以。

如何使该主题在流星中起作用?

谢谢。

注意:JS文件

  • 1.jquery.easing.min.js
  • 2.jquery.fittext.js
  • 3.wow.min.js

  • 4.creative.js

我按创意主题加载顺序放置它们

您有两个主要选择:

  1. 创建一个流星包 如果您的工作做得不错,那么您可能希望通过amosphere.js和github与社区共享它,以便其他人都可以利用您的工作。
  2. 将主题的.js文件放在/ public下,然后在/ client目录树中的某个位置创建一个名为head.html的文件,该文件不包含任何<template name="foo">指令。 相反,只需在所有页面的<head>部分中包含所需的指令,并用<head></head>括起来。 从html的该部分引用您的.js文件。

<head>部分对于建立您的google SEO代码以及google网站管理员工具验证代码也很有用。

我找到了一个完美的解决方案。 我希望它能对其他人有所帮助,我会在页面完全渲染后使用jquery和.rendered加载脚本,并在可用的情况下使用所有想要的效果

Template.layout.rendered = function() {

  $('head').append('<script type="text/javascript" src="/javascript/jquery.easing.min.js"></script>');
  $('head').append('<script type="text/javascript" src="/javascript/jquery.fittext.js"></script>');
  $('head').append('<script type="text/javascript" src="/javascript/wow.min.js"></script>');
  $('head').append('<script type="text/javascript" src="/javascript/creative.js"></script>');

}

无需在流星中提供样式表的引用。 只需将CSS文件放在client / stylesheets文件夹中即可。 流星将自动应用这些CSS规则。

JS也是如此。

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM