我想通过在zuck.js库中使用在离子应用程序中实现故事效果
zuck.js
我安装
npm install zuck
然后将其导入到我的home组件中
import { Component } from '@angular/core';
import { NavController } from 'ionic-angular';
import * as zuck from "zuck";
@Component({
selector: 'page-home',
templateUrl: 'home.html'
})
export class HomePage {
stories = new Zuck('stories', {
backNative:true,
autoFullScreen:'false',
skin:'Snapgram',
avatars:'true',
list:false,
cubeEffect:'true',
localStorage:true,
stories: [],
});
constructor(public navCtrl: NavController) {
}
但是它告诉我错误buck Zuck的大写字母未定义
referenceError：未定义Zuck ReferenceError：未在新主页上定义Zuck
我想将其更改为
import * as Zuck from "zuck";
但我得到同样的错误。
更新！！！
我将导入更改为
import Zuck from 'zuck';
我得到错误
运行时错误
找不到模块“反应”
无法在离子中使用zuck.js？
声明Zuck之后，我想创建对象，然后得到
无法读取null类型错误的属性“ id”：无法读取属性“ id”
新窗口中的null的位置。ZuckitaDaGalera.window.Zuck
（http://localhost:8100/build/vendor.js:115204:23）在新主页上
import { Component } from '@angular/core';
import { NavController } from 'ionic-angular';
import 'zuck.js/zuck.js';
declare var Zuck;
@Component({
selector: 'page-home',
templateUrl: 'home.html'
})
export class HomePage {
stories = new Zuck('stories', {
backNative: true,
autoFullScreen: 'false',
skin: 'Snapgram',
avatars: 'true',
list: false,
cubeEffect: 'true',
localStorage: true,
stories: [
{
id: 'vision',
photo: 'https://cnet4.cbsistatic.com/img/QJcTT2ab-sYWwOGrxJc0MXSt3UI=/2011/10/27/a66dfbb7-fdc7-11e2-8c7c-d4ae52e62bcc/android-wallpaper5_2560x1600_1.jpg',
name: 'Tech',
link: '',
lastUpdated: 1492665454,
items: [
this.buildItem('1', 'photo', 3, 'https://pbs.twimg.com/profile_images/782474226020200448/zDo-gAo0_400x400.jpg','', '', false, 1492665454),
this.buildItem('2', 'photo', 3, 'https://vignette4.wikia.nocookie.net/ironman/images/5/59/Robert-Downey-Jr-Tony-Stark-Iron-Man-3-Marvel-Disney.jpg/revision/latest?cb=20130611164804', '', '',false, 1492665454),
this.buildItem('3', 'video', 0, 'https://scontent-gru2-2.cdninstagram.com/t50.2886-16/14965218_193969377722724_482497862983221248_n.mp4', 'https://scontent-gru2-2.cdninstagram.com/t51.2885-15/e15/10597412_455246124639813_1360162248_n.jpg', '', false, 1492665454),
],
}],
});
constructor(public navCtrl: NavController) {
}
buildItem(id, type, length, src, preview, link, seen, time) {
// Using object short-hand (id: id)
return {id,type,length,src,preview,link,seen,time,
};
}
}
最佳答案
发布评论后，我意识到您为zuck使用了错误的npm软件包。 This npm软件包完全不同，这就是为什么您收到react模块错误的原因。使用this代替：
npm install zuck.js
然后像这样导入它：
import 'zuck.js/zuck.js';
declare var Zuck;
关于javascript - 在ionic 3中使用zuck js库，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/46469634/