我对 Foundation 6.4 中的 javascript 失去了理智。我不知道这个 Webpack 是怎么回事。似乎有些库/插件可以工作,而有些则不能。我的最新问题是关于 plyr ( https://plyr.io/ )。我不明白为什么 TweenMax 可以 100% 正常工作而 plyr.js 不能。我究竟做错了什么?
这是我得到的错误..
app.js:23026 Uncaught ReferenceError: plyr is not defined
这就是我的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"