SOLVED - A problem with using Tokenize2 as Aurelia Component

Help Requests
#1

I created an Aurelia component with Tokenize2

but I have problem

TypeError: $(...).tokenize2 is not a function
    at BootstrapTokenizeCustomElement.attached (tokenize.ts:35)
    at Controller.attached (vendor.js:12239)
    at View.attached (vendor.js:10289)
    at Controller.attached (vendor.js:12243)
    at View.attached (vendor.js:10289)
    at ViewSlot.attached (vendor.js:10647)
    at View.attached (vendor.js:10294)
    at ViewSlot.attached (vendor.js:10647)
    at vendor.js:1492
    at <anonymous>

2222
2222.png783×261 4.48 KB

111
111.png907×738 22.7 KB

so, I created a GitHub repository as a sample in here

Can anyone help me?

#2

after cloning and running ‘node setup’.

when doing gulp build, I get

TypeError: Cannot read property ‘customInspect’ of undefined
at Object. (/Users/cormazab/Documents/OrmaSoft_E.I.R.L./Proyectos/tokenize2-sample/sample/node_modules/fliplog/modules/inspector-gadget/index.js:9:39)
at Module._compile (module.js:541:32)
at Object.Module._extensions…js (module.js:550:10)
at Module.load (module.js:458:32)
at tryModuleLoad (module.js:417:12)
at Function.Module._load (module.js:409:3)
at Module.require (module.js:468:17)
at require (internal/module.js:20:19)
at Object. (/Users/cormazab/Documents/OrmaSoft_E.I.R.L./Proyectos/tokenize2-sample/sample/node_modules/fliplog/plugins/inspect.js:1:75)
at Module._compile (module.js:541:32)
MacBook-Pro-de-Cristian-Ormazabal:tokenize2-sample cormazab$

something’s missing on the repo. Please check and try again.

Regards

#3

I used skeleton-plugin-typescript (Mr. @vegarringdal’s masterpiece )
so, Please

  1. download sample

  2. run node setup

  3. run gulp watch

  4. http://localhost:4444/

3333
3333.png963×872 65.4 KB

#4

The root cause seems to be the tokenize2.js plugin not being registered. If you breakpoint in the plugin register section, it doesn’t get called

I made two things:

  1. in index.html, add the script for tokenize2.js. I don’t know other way of loading it before the app. The way it’s been included in the app doesn’t get the plugin initialized.
  1. in tokenize.ts, instead of doing

import * as $ from ‘jquery’;

i changed to

import ‘jquery’;

With that, the error disappears.

Regards.

3 Likes
#5

the error disappears but the component does not work so this is not an approach! :frowning:

#6

I pushed some changes

take a look, it seems to work properly :wink:

1 Like
#7

I can thank three people for their help

  1. @ormasoftchile
    Your tip works perfectly

import * as $ from ‘jquery’;
i changed to
import ‘jquery’;

  1. @vegarringdal
    about this

I edited the file from js to ts just to make sure it was included, then I changed this
and line 11:
} else if(typeof module === 'NAobject' && module.exports){

  1. @shahabganji
    My good friend for everything

and The result

Untitl2ed
Untitl2ed.png1536×395 14.3 KB

I am so happy because our aurelia-toolbelt is being completed every day. I hope we will be able to release version 1 in the next few months. Thanks for all your help in this way.

1 Like
#8

let tokenize = require('./tokenize2')

fusebox uses commonjs so this might help and you might not need to mess with 'naObject" btw

2 Likes