我对 Foundation 6.4 中的 javascript 失去了理智。我不知道这个 Webpack 是怎么回事。似乎有些库/插件可以工作,有些则不能。我的最新一期是 plyr ( https://plyr.io/ )。我不明白为什么 TweenMax 可以 100% 正常工作而 plyr.js 却不行。我究竟做错了什么?
这是我得到的错误..
app.js:23026 Uncaught ReferenceError: plyr 未定义
这就是我的 app.js 的样子..
import $ from 'jquery';
import whatInput from 'what-input';
window.$ = $;
window.jQuery = $;
require('./TweenMax.js');
require('./plyr.js');
//import Foundation from 'foundation-sites';
// If you want to pick and choose which modules to include, comment out the above and uncomment
// the line below
import './lib/foundation-explicit-pieces';
$(document).foundation().ready(function(){
TweenMax.set(".logo-center", {transformOrigin:"50% 50%"});
var blast = plyr.setup('#blast', {
hideControls: true,
clickToPlay: false,
controls: []
});
});
我的 config.yml 文件中也有 plyr.js 的路径:
# Your project's server will run on localhost:xxxx at this port
PORT: 8000
# Autoprefixer will make sure your CSS works with these browsers
COMPATIBILITY:
- "last 2 versions"
- "ie >= 10"
- "ios >= 9"
# UnCSS will use these settings
UNCSS_OPTIONS:
html:
- "src/**/*.html"
ignore:
- !!js/regexp .foundation-mq
- !!js/regexp ^\.is-.*
# Gulp will reference these paths when it copies files
PATHS:
# Path to dist folder
dist: "dist"
# Paths to static assets that aren't images, CSS, or JavaScript
assets:
- "src/assets/**/*"
- "!src/assets/{img,js,scss}/**/*"
# Paths to Sass libraries, which can then be loaded with @import
sass:
- "node_modules/foundation-sites/scss"
- "node_modules/motion-ui/src"
# Paths to JavaScript entry points for webpack to bundle modules
entries:
- "src/assets/js/app.js"
- "src/assets/js/plyr.js"
- "src/assets/js/TweenMax.js"
最佳答案
我假设您是从 ZURB template 开始您的基金会项目的.它使用 Gulpfile (gulpfile.babel.js) 将 JavaScript 模块与 Webpack 捆绑在一起。
在这个脚本中有一个 Webpack configuration如下所示:
let webpackConfig = {
module: {
rules: [
{
test: /.js$/,
use: [
{
loader: 'babel-loader'
}
]
}
]
}
}
Webpack config 可以在模块部分定义模块的一些规则(配置加载器、解析器选项等)。 特别是 loaders 使 webpack 能够处理文件并将它们打包(或执行其他 Webpack 任务)。
所以gulpfile.babel.js中的具体配置告诉Webpack使用babel-loader/src 文件夹中所有扩展名为 js 的文件。
然而,如 Webpack - Shimming 中所述一些模块/库可能需要全局依赖项(例如 jQuery 的 $)或创建需要导出的全局变量。
支持这些库,比如Plyr , 你可以使用 expose-loader .
所以在webpack config里面添加一个module rule
gulpfile.babel.js,指向expose-loader对于 plyr.js:
let webpackConfig = {
module: {
rules: [
{
test: /plyr.js/,
use: [
{
loader: 'expose-loader',
options: 'plyr'
}
]
},
{
test: /.js$/,
use: [
{
loader: 'babel-loader'
}
]
}
]
}
}
不需要对您的项目文件(config.yml、app.js)进行其他更改。
这样你应该像在你的 app.js 中一样访问 plyr 作为全局变量:
var blast = plyr.setup('#blast', {
hideControls: true,
clickToPlay: false,
controls: []
});
关于javascript - 项目中的 Foundation 6.4 JavaScript 无法正常工作,但外部 JS 可以,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/48526790/
总的来说,我对ruby还比较陌生,我正在为我正在创建的对象编写一些rspec测试用例。许多测试用例都非常基础,我只是想确保正确填充和返回值。我想知道是否有办法使用循环结构来执行此操作。不必为我要测试的每个方法都设置一个assertEquals。例如:describeitem,"TestingtheItem"doit"willhaveanullvaluetostart"doitem=Item.new#HereIcoulddotheitem.name.shouldbe_nil#thenIcoulddoitem.category.shouldbe_nilendend但我想要一些方法来使用
我试图在一个项目中使用rake,如果我把所有东西都放到Rakefile中,它会很大并且很难读取/找到东西,所以我试着将每个命名空间放在lib/rake中它自己的文件中,我添加了这个到我的rake文件的顶部:Dir['#{File.dirname(__FILE__)}/lib/rake/*.rake'].map{|f|requiref}它加载文件没问题,但没有任务。我现在只有一个.rake文件作为测试,名为“servers.rake”,它看起来像这样:namespace:serverdotask:testdoputs"test"endend所以当我运行rakeserver:testid时
作为我的Rails应用程序的一部分,我编写了一个小导入程序,它从我们的LDAP系统中吸取数据并将其塞入一个用户表中。不幸的是,与LDAP相关的代码在遍历我们的32K用户时泄漏了大量内存,我一直无法弄清楚如何解决这个问题。这个问题似乎在某种程度上与LDAP库有关,因为当我删除对LDAP内容的调用时,内存使用情况会很好地稳定下来。此外,不断增加的对象是Net::BER::BerIdentifiedString和Net::BER::BerIdentifiedArray,它们都是LDAP库的一部分。当我运行导入时,内存使用量最终达到超过1GB的峰值。如果问题存在,我需要找到一些方法来更正我的代
我在从html页面生成PDF时遇到问题。我正在使用PDFkit。在安装它的过程中,我注意到我需要wkhtmltopdf。所以我也安装了它。我做了PDFkit的文档所说的一切......现在我在尝试加载PDF时遇到了这个错误。这里是错误:commandfailed:"/usr/local/bin/wkhtmltopdf""--margin-right""0.75in""--page-size""Letter""--margin-top""0.75in""--margin-bottom""0.75in""--encoding""UTF-8""--margin-left""0.75in""-
Rails2.3可以选择随时使用RouteSet#add_configuration_file添加更多路由。是否可以在Rails3项目中做同样的事情? 最佳答案 在config/application.rb中:config.paths.config.routes在Rails3.2(也可能是Rails3.1)中,使用:config.paths["config/routes"] 关于ruby-on-rails-Rails3中的多个路由文件,我们在StackOverflow上找到一个类似的问题
我在我的项目目录中完成了compasscreate.和compassinitrails。几个问题:我已将我的.sass文件放在public/stylesheets中。这是放置它们的正确位置吗?当我运行compasswatch时,它不会自动编译这些.sass文件。我必须手动指定文件:compasswatchpublic/stylesheets/myfile.sass等。如何让它自动运行?文件ie.css、print.css和screen.css已放在stylesheets/compiled。如何在编译后不让它们重新出现的情况下删除它们?我自己编译的.sass文件编译成compiled/t
如何在buildr项目中使用Ruby?我在很多不同的项目中使用过Ruby、JRuby、Java和Clojure。我目前正在使用我的标准Ruby开发一个模拟应用程序,我想尝试使用Clojure后端(我确实喜欢功能代码)以及JRubygui和测试套件。我还可以看到在未来的不同项目中使用Scala作为后端。我想我要为我的项目尝试一下buildr(http://buildr.apache.org/),但我注意到buildr似乎没有设置为在项目中使用JRuby代码本身!这看起来有点傻,因为该工具旨在统一通用的JVM语言并且是在ruby中构建的。除了将输出的jar包含在一个独特的、仅限ruby
我需要从一个View访问多个模型。以前,我的links_controller仅用于提供以不同方式排序的链接资源。现在我想包括一个部分(我假设)显示按分数排序的顶级用户(@users=User.all.sort_by(&:score))我知道我可以将此代码插入每个链接操作并从View访问它,但这似乎不是“ruby方式”,我将需要在不久的将来访问更多模型。这可能会变得很脏,是否有针对这种情况的任何技术?注意事项:我认为我的应用程序正朝着单一格式和动态页面内容的方向发展,本质上是一个典型的网络应用程序。我知道before_filter但考虑到我希望应用程序进入的方向,这似乎很麻烦。最终从任何
我对最新版本的Rails有疑问。我创建了一个新应用程序(railsnewMyProject),但我没有脚本/生成,只有脚本/rails,当我输入ruby./script/railsgeneratepluginmy_plugin"Couldnotfindgeneratorplugin.".你知道如何生成插件模板吗?没有这个命令可以创建插件吗?PS:我正在使用Rails3.2.1和ruby1.8.7[universal-darwin11.0] 最佳答案 随着Rails3.2.0的发布,插件生成器已经被移除。查看变更日志here.现在
我在我的项目中添加了一个系统来重置用户密码并通过电子邮件将密码发送给他,以防他忘记密码。昨天它运行良好(当我实现它时)。当我今天尝试启动服务器时,出现以下错误。=>BootingWEBrick=>Rails3.2.1applicationstartingindevelopmentonhttp://0.0.0.0:3000=>Callwith-dtodetach=>Ctrl-CtoshutdownserverExiting/Users/vinayshenoy/.rvm/gems/ruby-1.9.3-p0/gems/actionmailer-3.2.1/lib/action_mailer