kimmobrunfeldt / progressbar.js

Responsive and slick progress bars

Home Page:https://kimmobrunfeldt.github.io/progressbar.js

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

shifty.interpolate is not a function

sieteunoseis opened this issue · comments

Getting error "shifty.interpolate is not a function" on the new version 1.1.0

Same here :(

Could you provide a bit more details? I can't seem to replicate the issue in local tests or JSFiddle.

I'm running it in Electron 7.0 on Nodejs v10.16.0. Let me see if it does the same error in a sandbox environment.

Hi, i switched from electron 2.0.2 to 4.1.2 and now i have this problem too.

Hello!

Tried to investigate a little, as an exercise routine for react/electron/JS etc stuff, to remove the error "Object(...) is not a function"
that was blocking the app in electron.

It seems that importing tween from shifty doesn't work as expected. It seems that react (version 15.6.2) is not able to resolve any named exports - it can only resolve the default export, i.e.
import {tween} from 'shifty'
statement can't actually find a tween export.

Maybe Node is resolving shifty to dist/shifty.node.js rather then dist/shifty.js (as far as I understood the only difference between dist/shifty.js and dist/shifty.node.js should be that the former references window and the latter references global).

Quick and dirty hack:

in file
node_modules\progressbar.js\src\path.js

Line 5
var Tweenable = shifty.shifty.Tweenable;
Line 151
return shifty.shifty.interpolate(this._opts.from, this._opts.to, this.value(), easing);
Line 156
return shifty.shifty.interpolate(this._opts.from, this._opts.to, progress, easing);


Side problem...to remove from the console

“Uncaught (in promise) undefined” error

I added an empty failure call in line 121 of

node_modules\progressbar.js\src\path.js

Path.prototype.animate = function animate(progress, opts, cb) {
// stuff here
   }).then(function(state) {
// stuff here
    }, function() {});  //empty call added

Apparently, no functional problem in the app behavior, working as expected.

To solve this warning
Warning: Accessing createClass via the main React package is deprecated, and will be removed in React v16.0.
I installed create-react-class and modified the relevant calls in

node_modules\react-progressbar.js\dist\react-progressbar.js
on top of the file, prepend
var createReactClass = require('create-react-class');
then in the relevant parts:

       // var Shape = React.createClass({
    var Shape = createReactClass({ 
	
	//    var Line = React.createClass({
    var Line = createReactClass({
  
	// var Circle = React.createClass({
    var Circle = createReactClass({

	// var SemiCircle = React.createClass({
    var SemiCircle = createReactClass({

Hope this helps...

(Just joined GitHub, first comment...be patient!)

I am able to fix it by importing ProgressBar like below:

import ProgressBar from 'progressbar.js/dist/progressbar'

commented

So I've found the most straightforward fix for this appears to be:

In the file:
node_modules\progressbar.js\src\path.js

Update line 3 from:
const shifty = require('shifty');
to
const shifty = require('shifty').shifty;

Still to find out what is truly going on though as even the example from shifty (https://github.com/jeremyckahn/shifty/blob/master/README.md) needs the same fix as I get the same error with the following in my own code (that can be fixed the same way)
const shifty = require('shifty');
shifty.tween({ from: { x: 0 }, to: { x: 10 } });

Thanks for the heads up about this, and thanks for finding a good solution @RoyMudie. I have fixed Shifty's documentation!

I tried the fix but the build failed: https://travis-ci.org/github/kimmobrunfeldt/progressbar.js/builds/685994475. Reverting back to the old require method worked. If someone is able to provide more information about the issue, I can take another look.

Actually I realized from the comment by @divyeshmakwana96 that the package.json points to src/main.js instead of the built distributable file. I changed it to use dist/progressbar.js now and it should fix this. Can you test with latest main?

Just as a note, this should be improved in Shifty 2.9.1: All modules are now published as ES6 modules. jeremyckahn/shifty@3180c28