Using JS functionality in Ionic App Component TS - javascript

Within an Ionic app, I'm trying to call an external JS file's functions in a TS file and am receiving this error: (Line 9 is labelImage = function(){)
Error: Uncaught (in promise): Error: Module parse failed: Unexpected token (9:15)
You may need an appropriate loader to handle this file type.
|
| export class CloudVision{
| labelImage = function(){
| // Creates a client
| const client = new vision.ImageAnnotatorClient();
I import this JS file at the start of the TS file:
import { CloudVision } from '../../../vision.js'
and use it with:
CloudVision.labelImage()

try this
import * from '../../../vision.js
or include it in ionic-li
or look for type definition in typings

Related

How to connect to use UpcastWriter

I downloaded ckeditor from
https://ckeditor.com/ckeditor-5/online-builder/
unpack files to folder next to my application
and used ckeditor.js in my app
Everything works well, but I needed it UpcastWriter .
Then in my component
import * as UpcastWriter from '#ckeditor/ckeditor5-engine/src/view/upcastwriter';
myFunction() {
let viewDocument = editor.editing.view.document
const writer = new UpcastWriter(viewDocument);
const fragment = writer.createDocumentFragment();
}
I got an error
Uncaught (in promise): CKEditorError: ckeditor-duplicated-modules
Read more: https://ckeditor.com/docs/ckeditor5/latest/support/error-codes.html#error-ckeditor-duplicated-modules
Who knows how to fix it ?
Thanks.

I don't understand why it is having this error. Even if the directory is correct and also the filename

IMAGE OF THE ERROR
Android Bundling failed 5334ms
Unable to resolve module ../model/weights.bin from
D:\Repos\BANANAFILE\helpers\tensor-helper.js:
None of these files exist:
model\weights.bin(.native|.android.ts|.native.ts|.ts|.android.tsx|.native.tsx|.tsx|.android.js|.native.js|.js|.android.jsx|.native.jsx|.jsx|.android.json|.native.json|.json)
model\weights.bin\index(.native|.android.ts|.native.ts|.ts|.android.tsx|.native.tsx|.tsx|.android.js|.native.js|.js|.android.jsx|.native.jsx|.jsx|.android.json|.native.json|.json)
10 |
11 | const modelJson = require('../model/model.json');
12 | const modelWeights = require('../model/weights.bin');
React-native uses es6 imports so do this instead
import modelJson from "../model/model.json"
import modelWeights from "../model/weights.bin"

How to import custom exported js functions in background.js on electron vue?

I'm developing a desktop application using Electron and Vue. I'm trying to use a custom exported function inside my background.js file but I'm getting the following error:
You may need an appropriate loader to handle this file type, currently no loaders are configured to process this file. See https://webpack.js.org/concepts#loaders
|
| export class CustomPojo {
> customVariable;
|
| constructor(variable) {
# ./src/test/index.js 2:0-49 5:17-21
# ./src/background.js
# multi ./src/background.js
I have the following folder structure:
- src
-- test.js
- utils
-- customPojo.js
- background.js
The test.js has a simple export function that just does a console log to debug the application:
import { c } from "#/utils/customPojo";
export function test() {
c.whatever();
console.log("testing);
}
The customPojo.js has the following content:
export class CustomPojo {
customVariable;
constructor(variable) {
this.customVariable = variable;
}
async whatever(){}
}
I'm importing the test function in my background.js like that:
import { test } from './test';
Anyone has a clue about what's happening? I've googled about the error, but I'm unable to make this work.

TypeScript error "Could not find a declaration file for module" - unable to fix

I'm normally able to resolve this error easily enough, but this time nothing seems to work.
My main.ts file has this:
import locale from 'element-ui/lib/locale/lang/en';
The error:
ERROR in /Volumes/SuperData/Sites/reelcrafter/rc-ts/src/main.ts
6:20 Could not find a declaration file for module 'element-ui/lib/locale/lang/en'. '/Volumes/SuperData/Sites/reelcrafter/rc-ts/node_modules/element-ui/lib/locale/lang/en.js' implicitly has an 'any' type.
Try `npm install #types/element-ui` if it exists or add a new declaration (.d.ts) file containing `declare module 'element-ui';`
4 | import store from './store';
5 | import ElementUI from 'element-ui';
> 6 | import locale from 'element-ui/lib/locale/lang/en';
| ^
7 | import VueDragDrop from 'vue-drag-drop';
8 | import './styles/element-setup.scss';
9 | import './bootstrap/amplify-setup';
No lint errors found
Version: typescript 3.0.1, tslint 5.11.0
In my declarations.d.ts at root level, I added the following:
declare module 'element-ui';
This doesn't fix it. Nor does declare module 'element-ui/*';. How do I fix it?
Reproduction repo: https://github.com/ffxsam/repro-element-ts-bug
Create a declaration file called shims-element-ui.d.ts with following contents:
declare module 'element-ui/*';

Importing several icons at once using react-icons

I'm trying to import multiple icons from the same pack at once, in this case, font-awesome like this:
import {FaPencilSquare,FaHome} from 'react-icons/fa'
but I'm getting this error:
ERROR in ./node_modules/react-icons/fa/index.js
Module build failed: SyntaxError: Unexpected token, expected { (1:7)
> 1 | export Fa500px from './500px';
| ^
2 | export FaAdjust from './adjust';
3 | export FaAdn from './adn';
4 | export FaAlignCenter from './align-center';
If I import icons separately I don't get any errors,
any ideas what it could be?
Thanks to #bennygenel it seems like there is an open issue with that a workaround is to add the lib folder to your import like this:
import {FaHome,FaPencilSquare} from 'react-icons/lib/fa'

Categories

Resources