Hyperline does not load: Plugin error: hyperline: Error occurred in `decorateHyper`.

[lucianonooijen]

Since yesterday Hyperline does not seem to load anymore. There were no changes in any other settings.

I get the following notification:

Plugin error: hyperline: Error occurred in `decorateHyper`. Check Developer Tools for details

The complete Developer Tools log after starting Hyperterm:

(re)loading renderer plugins
bundle.js:1 Plugin hyperpower (1.0.0) loaded.
bundle.js:1 Plugin hyperterm-1password (2.0.1) loaded.
bundle.js:1 Plugin hyperterm-alternatescroll (1.3.0) loaded.
bundle.js:1 Plugin hyper-tab-icons (2.1.0) loaded.
bundle.js:1 Plugin gitrocket (1.0.5) loaded.
bundle.js:1 Plugin hyperterm-monokai (0.1.2) loaded.
bundle.js:1 Plugin hyperline (0.6.1) loaded.
bundle.js:1 TypeError: Cannot read property 'string' of undefined
    at hyperlineFactory (/Users/lucianonooijen/.hyper_plugins/node_modules/hyperline/dist/hyperline.js:223:33)
    at decorateHyper (/Users/lucianonooijen/.hyper_plugins/node_modules/hyperline/dist/hyperline.js:124:52)
    at y.forEach (file:///Applications/Hyper.app/Contents/Resources/app.asar/renderer/bundle.js:1:2117)
    at Array.forEach (<anonymous>)
    at getDecorated (file:///Applications/Hyper.app/Contents/Resources/app.asar/renderer/bundle.js:1:2057)
    at Object.render (file:///Applications/Hyper.app/Contents/Resources/app.asar/renderer/bundle.js:1:2944)
    at h (file:///Applications/Hyper.app/Contents/Resources/app.asar/renderer/bundle.js:1:143441)
    at beginWork (file:///Applications/Hyper.app/Contents/Resources/app.asar/renderer/bundle.js:1:145178)
    at d (file:///Applications/Hyper.app/Contents/Resources/app.asar/renderer/bundle.js:1:157653)
    at f (file:///Applications/Hyper.app/Contents/Resources/app.asar/renderer/bundle.js:1:157993)
y.forEach @ bundle.js:1
bundle.js:1 [Notification] Plugin error: hyperline: Error occurred in `decorateHyper`. Check Developer Tools for details
index.html:35 total init time 276.7900000000001

My Hyper config JS file:

// Future versions of Hyper may add additional config options,
// which will not automatically be merged into this file.
// See https://hyper.is#cfg for all currently supported options.

module.exports = {
    config: {
        // Choose either "stable" for receiving highly polished,
        // or "canary" for less polished but more frequent updates
        updateChannel: 'stable',

        // default font size in pixels for all tabs
        fontSize: 18,

        // font family with optional fallbacks
        fontFamily: 'Menlo, "DejaVu Sans Mono", Consolas, "Lucida Console", monospace',

        // terminal cursor background color and opacity (hex, rgb, hsl, hsv, hwb or cmyk)
        cursorColor: 'rgba(248,28,229,0.8)',

        // `BEAM` for |, `UNDERLINE` for _, `BLOCK` for █
        cursorShape: 'BLOCK',

        // set to true for blinking cursor
        cursorBlink: false,

        // color of the text
        foregroundColor: '#fff',

        // terminal background color
        backgroundColor: '#000',

        // border color (window, tabs)
        borderColor: '#333',

        // custom css to embed in the main window
        css: '.xterm-viewport { overflow: hidden !important; }',

        // custom css to embed in the terminal window
        termCSS: '',

        // set to `true` (without backticks) if you're using a Linux setup that doesn't show native menus
        // default: `false` on Linux, `true` on Windows (ignored on macOS)
        showHamburgerMenu: '',

        // set to `false` if you want to hide the minimize, maximize and close buttons
        // additionally, set to `'left'` if you want them on the left, like in Ubuntu
        // default: `true` on windows and Linux (ignored on macOS)
        showWindowControls: '',

        // custom padding (css format, i.e.: `top right bottom left`)
        padding: '12px 14px',

        // the full list. if you're going to provide the full color palette,
        // including the 6 x 6 color cubes and the grayscale map, just provide
        // an array here instead of a color map object
        colors: {
            black: '#000000',
            red: '#ff0000',
            green: '#33ff00',
            yellow: '#ffff00',
            blue: '#0066ff',
            magenta: '#cc00ff',
            cyan: '#00ffff',
            white: '#d0d0d0',
            lightBlack: '#808080',
            lightRed: '#ff0000',
            lightGreen: '#33ff00',
            lightYellow: '#ffff00',
            lightBlue: '#0066ff',
            lightMagenta: '#cc00ff',
            lightCyan: '#00ffff',
            lightWhite: '#ffffff'
        },

        // the shell to run when spawning a new session (i.e. /usr/local/bin/fish)
        // if left empty, your system's login shell will be used by default
        //
        // Windows
        // - Make sure to use a full path if the binary name doesn't work
        // - Remove `--login` in shellArgs
        //
        // Bash on Windows
        // - Example: `C:\\Windows\\System32\\bash.exe`
        //
        // Powershell on Windows
        // - Example: `C:\\WINDOWS\\System32\\WindowsPowerShell\\v1.0\\powershell.exe`
        shell: '',

        // for setting shell arguments (i.e. for using interactive shellArgs: ['-i'])
        // by default ['--login'] will be used
        shellArgs: ['--login'],

        // for environment variables
        env: {},

        // set to false for no bell
        bell: 'SOUND',

        // if true, selected text will automatically be copied to the clipboard
        copyOnSelect: false

        // if true, on right click selected text will be copied or pasted if no
        // selection is present (true by default on Windows)
        // quickEdit: true

        // URL to custom bell
        // bellSoundURL: 'http://example.com/bell.mp3',

        // for advanced config flags please refer to https://hyper.is/#cfg
    },

    // a list of plugins to fetch and install from npm
    // format: [@org/]project[#version]
    // examples:
    //   `hyperpower`
    //   `@company/project`
    //   `project#1.0.1`
    plugins: [
        'hyperpower', 
        'hyperterm-1password', 
        //'hyper-john',
        //'hyper-command-gifs',
        //'hyperline#0.6.1',
        //'hyperline', 
        'hyperterm-alternatescroll', 
        'hyper-tab-icons', 
        //'hyper-cat',
        'gitrocket', 
        //'hypergravity',
        'hyperterm-monokai', 
        "hyperline#0.6.1"
    ],

    // in development, you can create a directory under
    // `~/.hyper_plugins/local/` and include it here
    // to load it and avoid it being `npm install`ed
    localPlugins: [],

    keymaps: {
        // Example
        // 'window:devtools': 'cmd+alt+o',
    },

    hyperCat: {
        staggerHeight: 2, // The number of pixels the cat and rainbow should jump up and down.
        rainbowMaxAlpha: 1, // The max opacity of the rainbow.
        audioEnabled: true // Whether audio should play while typing.
    }
};

Disabling all plugins except Hyperline does not work.

[0xpetersatoshi]

Same thing happened to me yesterday but this was after I upgraded to Hyper version 2.0. I suspect maybe you inadvertently did the same. What version of hyper are you on?

[lucianonooijen]

I was also running Hyper v2.0. I took an old version of Hyper from a Time Machine backup and now it seems to be working, but with v2.0 the issue is still there.

[lucianonooijen]

Unfortunately Hyper keeps updating itself, and I see no way to prevent that from happening (without digging in the source code). I now switched back to iTerm2 for the time being, but it would be great if I could use Hyper again soon

[alxtz]

@lucianonooijen Same here, I wonder why would the hyper dev team trade all plugin & ability to customize with yet another render engine

[liloow]

I found a dirty workaround if you are interested (works with latest stable 2.0.x and is hyper agnostic) :

.hyper.js change version to 0.6.1

...
plugins: [
    'hyperlinks',
    'hyper-search',
    'hypergoogle',
    'hypersixteen',
    'hyperline#0.6.1',
    'hyperlayout',
    'hyper-autohide-tabs',
    // 'hyper-transparent-dynamic'
  ],
...

hyperline.js on line 122

{
...
      function decorateHyper(Hyper, _ref4) {
      var React = _ref4.React;
      var notify = _ref4.notify;
      var Component = React.Component;
-         PropTypes = React.PropTypes
+     React.PropTypes = require('prop-types')
...
}

Don't forget to run yarn add prop-types inside ~/.hyper-plugins

[JMY1000]

@liloow What's dirty about that? Seems fine to me.

[liloow]

@JMY1000 I was expecting it to be overridden on each plugin update but now that you mention it I realize my mistake! It is still a rollback and I am directly mutating the React object (which generally not the best idea).

But I have to agree with you, the expression might have been a tad extreme!

[chinanf-boy]

I find every time when you hyper isomething,

the .hyper_plugins/node_modules will reload, Change got

❕put the node_modules/hyperline to the .hyper_plugins/local/hyperline

May help

.hyper.js

localPlugins: [
"hyperline"   
]

hyperline.js#L122

React.PropTypes = require('prop-types')

hyperline/package.json

  "dependencies": {
    "prop-types": "^15.6.1",

⚠️dont forget local/hyperline/package.json install

yarn

npm i

[liloow]

@chinanf-boy You're right! I almost never all my terminal windows so I didn't notice it first, my bad! Your solution should indeed work, don't forget to remove "hyperline" from your plugins as well otherwise, they will conflict!

I had to go with a more radical solution myself because this system of auto-updating for no reasons every 5h without being able to opt out is mildly infuriating to me.

~/.hyper_plugins/node_modules/hyperline/
total 20
drwxr-xr-x  3 tom  tom  4096 May 31 14:27 .
drwxr-xr-x 39 tom  tom  4096 May 31 14:43 ..
drwxr-xr-x  2 root root 4096 May 31 14:39 dist
-r--r--rw-  1 root root  978 Nov  8  2016 package.json
-rw-r--r--  1 root root 3168 Oct 20  2016 README.md

~/.hyper_plugins/node_modules/hyperline/dist
total 64
drwxr-xr-x 2 root root  4096 May 31 14:39 .
drwxr-xr-x 3 tom  tom   4096 May 31 14:27 ..
-rw-r--r-- 1 root root 54243 May 31 14:46 hyperline.js
```bash
~/.hyper_plugins

total 64
drwxr-xr-x  5 tom  tom   4096 May 31 14:32 .
drwx------ 48 tom  tom  16384 May 31 14:56 ..
drwxr-xr-x  3 tom  tom   4096 May 31 06:25 cache
drwxr-xr-x  2 tom  tom   4096 May 31 06:21 local
drwxr-xr-x 39 tom  tom   4096 May 31 14:43 node_modules
-r--r--rw-  1 root root   467 May 31 14:43 package.json
-rw-r--r--  1 tom  tom   4896 May 31 14:09 package-lock.json
-rw-r--r--  1 tom  tom   8398 May 31 14:43 yarn-error.log
-rw-r--r--  1 tom  tom   6937 May 31 14:39 yarn.lock

[chinanf-boy]

Make Sence

❤️and , one more thing Help 🤔️

config.hyperline can work with this version hyperline??

// .hyper.js

hyperline: {                                                                 
  plugins: [                                                                 
    "ip"                                                                 
  ]                                                                          
}

### I can not just show ip, or something etc, 

### If I set hyperline, nothing show up but `black` border .

![bug-demo](https://user-images.githubusercontent.com/20272484/40792451-8be2a638-652c-11e8-96b7-f9618edd30f6.png)

- [x] Done

``` js
// config change
    hyperline: {                                                                 
      plugins: [                                                                 
        {
          name: 'network',
          options: {
            color: 'lightCyan'
          }
        },
        {
          name: 'battery',
          options: {
            colors: {
              fine: 'lightGreen',
              critical: 'lightRed'
            }
          }
        }
      ]                                                                                                                                     
    }
  },

[ajfick]

@chinanf-boy This may be a dumb question, but where can I find the list of which options are available to each plugin? For example, in the two that you noted in https://github.com/Hyperline/hyperline/issues/155#issuecomment-393575812 , network uses color while battery uses colors with multiple options.. Whenever I try to add another plugin other than the ones that you included in your comment above, I get an error..

[chinanf-boy]

@ajfick I almost forgot, eventually found it https://www.npmjs.com/package/hyperline/v/0.6.1

If you Look above, The version we use is 0.6.1

[ajfick]

@chinanf-boy Thank You!!

[nazariyv]

why wasn't this ever merged? I am still having this issue on my Ubuntu machine