We Keep Coding

How to Use Kuromoji.js in Javascript

I recently installed a package w/ Bower from here: https://github.com/takuyaa/kuromoji.js/
Reading the installation on the github, I basically copied and pasted from the guide:
kuromoji.builder({ dicPath: "../bower_components/kuromoji/dict/" }).build(function (err, tokenizer) {
// tokenizer is ready
var path = tokenizer.tokenize("すもももももももものうち");
console.log(path);
});
However, I do not know what the "kuromoji" should refer to. Here is the obvious error:
Uncaught ReferenceError: kuromoji is not defined
Here is a screenshot of my directory tree:
Not sure how to properly use this.

import kuromoji from 'kuromoji'
That provides the 'kuromoji' object you're trying to reference

Uncaught Error: Module name "https" has not been loaded yet for context: _. Use require([])

This is the error that I'm getting-
Uncaught Error: Module name "https" has not been loaded yet for context: _. Use require([])
http://requirejs.org/docs/errors.html#notloaded
at makeError (require.js:168)
at Object.localRequire [as require] (require.js:1436)
at requirejs (require.js:1797)
at Dataverse_API_node.js:1
I have an explore.html page which calls the script Dataverse_API_node.js, which is itself dependent on the require.js file. My Dataverse_API_node.js script is supposed to display its output data on the explore.html page. However, I face the above error when I load the explore.html page.
Note that my Dataverse_API_node.js script runs independently without errors and displays the data in the command prompt when run through the Node.js command prompt.
There are the first few lines of the Dataverse_API_node.js script-
const https = require("https");
var parseString = require('xml2js').parseString;
const demo_url = "https://demo.dataverse.org"
const actual_url = "https://demo.dataverse.org/dataverse/hbstest"
const search_uri = "/api/search"
const options = "?q=*&subtree=COSgak"
This is the part of explore.html where I'm calling the Dataverse_API_node.js script and supposed to display the data-
<p>
<script src="Dataverse_API_node.js" src="https://cdnjs.cloudflare.com/ajax/libs/require.js/2.3.5/require.js">
document.write(search_for_all("https://demo.dataverse.org", 0, 'file'));
</script>
</p>
I'm new to Javascript and would really appreciate some help with this error. Please don't send me to requirejs.org as it doesn't really help.
Thank you for your time.

Solution found. Just use browserify. Install browserify and then run the following command-
> browserify Dataverse_API_node.js > bundle.js
Browserify goes through all the 'require' in your script and wraps it up in bundle.js and helps to run the node.js modules in the browser.
Just add the following script in your .html file-
<script type=text/javascript src="scripts/bundle.js"></script>

How to properly use JQuery and Bootstrap in latest Angular versions

Yes, this question may be repeated. But I just don't get this setup working in any way.
I tried prettty much everything:
Getting the libraries directly into the index.html through a CDN.
Installing them via NPM and then adding them to angular-cli.json script field.
Importing the modules directly into my components, both with aliased JQuery (import * as $ from 'jquery') and just plain import (import 'jquery').
I tried other setups, like doing the imports in the root component, importing these libraries in various locations... but I don't get this working.
Currently, I need to get working one Bootstrap modal, and one Datepicker component which also works with JQuery, but it's being impossible for me. Sometimes I get the '$ is undefined' and sometimes I get other errors.
So now, I will ask: which is the real solution for this problem in latest Angular versions? How should I make the imports?
Thank you!
EDIT: Current situation:
Added the dependencies to the angular-cli.json file:
"styles": [
"styles.css",
"../node_modules/bootstrap/dist/css/bootstrap.min.css",
"../node_modules/font-awesome/css/font-awesome.css"
],
"scripts": [
"../node_modules/jquery/dist/jquery.min.js",
"../node_modules/bootstrap/dist/js/bootstrap.bundle.min.js"
],
I try to call the .modal() function that bootstrap has to add to Jquery:
( $('#myModal')).modal({
backdrop: true,
focus: true,
show: true
})
But it just throws...:
SegmentsComponent.html:15 ERROR ReferenceError: $ is not defined
at SegmentsComponent.openModal (segments.component.ts:55)
at Object.eval [as handleEvent] (SegmentsComponent.html:15)
at handleEvent (core.js:13255)
at callWithDebugContext (core.js:14740)
at Object.debugHandleEvent [as handleEvent] (core.js:14327)
at dispatchEvent (core.js:9704)
at eval (core.js:10318)
at HTMLAnchorElement.eval (platform-browser.js:2614)
at ZoneDelegate.invokeTask (zone.js:425)
at Object.onInvokeTask (core.js:4620)
Any help?

mmmmm .. it looks very strange .. the only reason why it can gives to you $ is not defined is because you DON'T INCLUDE IT well..
so what i can suggest to you is to DOUBLE check your jquery path in the scripts :[] section ..
REMEMBER .. the path is intended from the src(or your root: entry) folder!
ALSO check the jquery version .. I saw that NPM don't include jquery when you do install bootstrap ... so install jquery manually and get the right version ..
AND in your .ts file .. have you declare var $ : any in the head of your ts file? ...
Hope it helps you!

You need to install Jquery and bootstrap (popper for Bootstrap 4) with package managers or CDN. Your .angular-cli.json file must look like this:
"scripts": [
"../node_modules/jquery/dist/jquery.js",
"../node_modules/popper.js/dist/umd/popper.js",
"../node_modules/bootstrap/dist/js/bootstrap.js"
],
Make sure these three files exist.

I found the answer, it can be solved by two methods one is included js file in index.html or ou can include like this, also you can include js as well as jquery.
ngOnInit() {
$(document).ready(function () {
$.getScript('../../assets/frontend/js/app.js', function (w) { });
}); }

how to load electron module in typescript

I try to get the ipcRenderer module from electron in typescript to send informations from the current component to the core and to get informations back to the window (electron-chromium-browser).
All I get is a error "Module not found" by transcoding the ts-code to ES5.
const ipc = require('electron').ipcRenderer;`
Update: The Error is switching between the "Module not found" and this one:
ERROR in ./~/electron/index.js
Module build failed: Error: ENOENT, open '/.../node_modules/electron/index.js'
# ./app/components/search/search.ts 12:10-29
That is from the current electron-api. I have also tried to use the import syntax from typescript but the result is the same.
Than I tried to use the electron.ipcRenderer module in a ES5-file, loaded/linked directly in the html-file.
There it worked. Why?

Solved the problem after 10h searching.
Problem was the webpack-transcoder.
https://github.com/chentsulin/webpack-target-electron-renderer
https://github.com/chentsulin/electron-react-boilerplate/blob/master/webpack.config.development.js

Since electron dependency in the browser app is not real, meaning it's not webpacked from node_modules but instead loaded in runtime, the require statement caused errors such as "fs" not found for me.
However you can trick the typescript with this:
if (typeof window['require'] !== "undefined") {
let electron = window['require']("electron");
let ipcRenderer = electron.ipcRenderer;
console.log("ipc renderer", ipcRenderer);
}
Also if you are writing a web app, which only is augmented by electron when it's running inside, this is a better way since you don't have to add electron as a dependency to your webapp just when using the communication parts.

Than I tried to use the electron.ipcRenderer module in a ES5-file, loaded/linked directly in the html-file.
If it works in html but fails in ts it means the error is not in const ipc = require('electron').ipcRenderer;. The error is most likey in the import you have to load your file from html (and not require('electron')).

This solved the problem for me:
You can fix it, just add to the "package.json"
"browser": {
"fs": false,
"path": false,
"os": false }
Source: https://github.com/angular/angular-cli/issues/8272#issuecomment-392777980

You can trick ts with this (dirty hack, but it works):
const { ipcRenderer } = (window as any).require("electron");

Error: Cannot find module 'utils'

I'm running a file main.js using Casper.js via casperjs main.js, which uses a module ./lib/myUtils.js, which in turn uses
var utils = require('utils')
But running casperjs main.js throws the error
Error: Cannot find module 'utils'
phantomjs://bootstrap.js:289
phantomjs://bootstrap.js:254 in require
/Users/username/casper-test/lib/myUtils.js:2
/Users/username/casper-test/lib/myUtils.js:63
TypeError: 'undefined' is not a function (evaluating 'myUtils.loadCookies()')
/Users/username/casper-test/main.js:104
The functions being imported have "use strict"; in their first line.
However putting the code from myUtils.js directly into main.js avoids the error. Why is this?

I suppose you need to insert var require = patchRequire(require); at the beginning of your file ( myUtils.js ).