Question

Rails noob在这里。

我一直在尝试将wrapbootstrap一页视差主题（https://wrapbootstrap.com/theme/ashley-one-page-parallax-WB0R11207）集成到我的rails 4应用程序中。

解压缩文件后，index.html页面（大多数情况下）正常工作，开箱即用。

我尝试将其集成到新的rails应用程序中的过程：

将所有CSS文件传输到assets / stylesheets文件夹
将所有JS文件传输到assets / javascripts文件夹
引用了application.js和application.css
将所有图像传输到资源/图像文件夹
生成新页面控制器/视图，并将之前讨论的html文件移动到此视图中
将root分配给上面的html文件

我遇到的问题是所有的JS和CSS似乎都没有执行。我在头文件中包含JS和CSS包含标签。

我尝试过rake资产：预编译，但这并不成功。

关于我在哪里出错的任何提示？

此外，index.html文件在头部包含一堆CSS设置，即：

<!-- Bootstrap  -->
<link type="text/css" rel="stylesheet" href="bootstrap/css/bootstrap.min.css">
<!-- web font  -->
<link href="http://fonts.googleapis.com/css?family=Open+Sans:300,400,600,800" rel="stylesheet" type="text/css">
<!-- plugin css  -->
<link rel="stylesheet" type="text/css" href="js-plugin/animation-framework/animate.css" />
<link rel="stylesheet" type="text/css" href="js-plugin/magnific-popup/magnific-popup.css" />
<link type="text/css" rel="stylesheet" href="js-plugin/isotope/css/style.css">
<link rel="stylesheet" type="text/css" href="js-plugin/flexslider/flexslider.css" />
<link rel="stylesheet" type="text/css" href="js-plugin/pageSlide/jquery.pageslide.css" />
<!-- Owl carousel-->
<link rel="stylesheet" href="js-plugin/owl.carousel/owl-carousel/owl.carousel.css">
<link rel="stylesheet" href="js-plugin/owl.carousel/owl-carousel/owl.theme.css">

和身体底部的一堆javascrip标签，即：

<script type="text/javascript" src="js-plugin/respond/respond.min.js"></script>
<script type="text/javascript" src="js-plugin/jquery/1.8.3/jquery.min.js"></script>
<script type="text/javascript" src="js-plugin/jquery-ui/jquery-ui-1.8.23.custom.min.js"></script>
<!-- third party plugins  -->
<script type="text/javascript" src="bootstrap/js/bootstrap.js"></script>
<script type="text/javascript" src="js-plugin/easing/jquery.easing.1.3.js"></script>

<script type="text/javascript" src="js-plugin/flexslider/jquery.flexslider-min.js"></script>

<script type="text/javascript" src="js-plugin/isotope/jquery.isotope.min.js"></script>
<script type="text/javascript" src="js-plugin/neko-contact-ajax-plugin/js/jquery.form.js"></script>
<script type="text/javascript" src="js-plugin/neko-contact-ajax-plugin/js/jquery.validate.min.js"></script>
<script type="text/javascript" src="js-plugin/magnific-popup/jquery.magnific-popup.min.js"></script>
<script type="text/javascript" src="js-plugin/parallax/js/jquery.scrollTo-1.4.3.1-min.js"></script>
<script type="text/javascript" src="js-plugin/parallax/js/jquery.localscroll-1.2.7-min.js"></script>

我是否理解使用资产管道，视图中不需要这些标注？不应该在application.css和application.js中预编译所有的CSS和JS吗？

Answer 1

问题是我带来了模板中包含的所有CSS和JSS文件，但该文件夹还包含不需要的CSS和JS，其中一些文件在加载到资产管道时引起冲突。一旦我删除了所有不需要的文件，所有文件都按预期工作。

总结：将所有必需的CSS文件移动到资产/样式表将所有必需的JS文件移动到assets / javascripts

在各自的application.css和application.js文件中明确包含/要求每个CSS / JS文件。

使用rails 4 app实现wrapbootstrap主题的问题

1 个答案: