CODEWITHSUNDEEP
javascriptnode.jsvue.jsmodule
Rohan Kapur
Rohan Kapur

Reputation: 139

How do I import this file into VueJS?

I have this file which looks like it was written in fairly outdated syntax that I want to include in a VueJS Component. The link to the file is here.

For example, take a look at these lines from the file:

var CCC = CCC || {};
CCC.STATIC = CCC.STATIC || {};

CCC.STATIC.TYPE = {
  'TRADE': '0',
  'FEEDNEWS': '1',
  'CURRENT': '2',
  'LOADCOMPLATE': '3',
  'COINPAIRS': '4',
  'CURRENTAGG': '5',
  'TOPLIST': '6',
  'TOPLISTCHANGE': '7',
  'ORDERBOOK': '8',
  'FULLORDERBOOK': '9',
  'ACTIVATION': '10',
  'FULLVOLUME': '11',
  'TRADECATCHUP': '100',
  'NEWSCATCHUP': '101',
  'TRADECATCHUPCOMPLETE': '300',
  'NEWSCATCHUPCOMPLETE': '301'
};

In my component, I need to be able to write things like

if (messageType == CCC.STATIC.TYPE.CURRENTAGG) { foobar(message) }

How would I go about importing the file into my component in a way through which I can reference it's declarations cleanly?

Upvotes: 0

Views: 244

Answers (2)

P3trur0
P3trur0

Reputation: 3225

You can copy the content of the original js file in another file of your application, let's say: embellished-ccc-streamer-utilities.js.

Then, as final row of this new file you can add the following line:

  export default CCC

This basically exports the CCC object to make it available in other modules of your application.

Indeed, after this minor embellishment of the original file, you can import it as a normal module, like this:

import CCC from './embellished-ccc-streamer-utilities.js'

and use it according to your needs, for example:

if (messageType == CCC.STATIC.TYPE.CURRENTAGG) { foobar(message) }

Upvotes: 0

gvk
gvk

Reputation: 466

Add the following as data.js [I have removed the semi-colons and the use of CCC before it was declared, to shut up my linter :-)]

var CCC = {}
CCC.STATIC = CCC.STATIC || {}

CCC.STATIC.TYPE = {
  'TRADE': '0',
  'FEEDNEWS': '1',
  'CURRENT': '2',
  ...
  ...
  'NEWSCATCHUPCOMPLETE': '301'
}

export default CCC

And in your component you go:

import CCC from './data.js' // adjust the path accordingly
...
...
mounted () {
    ...
    console.log(CCC.STATIC)
    console.log(CCC.STATIC.TYPE.TRADE)
}

Please check out the Examples section here: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/import

Hope this helps.

Upvotes: 1

Related Questions