Problem with using Govuk-Frontend npm package in Oracle JET Application - javascript

Problem with 'Get started' (https://frontend.design-system.service.gov.uk/get-started/)
I am trying to use Govuk-Frontend npm package in Oracle JET Application. I have included the package in path_mapping.json and main.js.
When I try to use them in js file I am getting an error saying "Uncaught (in promise) TypeError: Cannot read properties of undefined (reading 'initAll')".
js file to be called from the package in node modules is all.js ..Directory structure in node modules for the package is Govuk-Frontend/govuk/all.js
I have renamed all.js inside the package to govuk.js.
Error=>
path_mapping.json =>
main.js in requirejs.config=>
dashboard.js =>
How can I call initAll() function from Govuk-Frontend npm package?

Related

Importing tex2max.js into an angular project via npm / index.html

When I try to import tex2max using declare var tex2max: any; I get a ReferenceError: tex2max is not defined. But this doesn't occur with other npm packages. I have tried binding the scripts by installing the npm package and through the script tag in index.html to no avail.
Here is a CDN file of the source code:
https://unpkg.com/tex2max#1.3.0/lib/tex2max.js
If the project author corrected their bundle a little you could do:
import TeX2Max from 'tex2max';
But that ends in error [EDIT: on stackblitz]
Error in /turbo_modules/tex2max#1.3.0/lib/tex2max.js (13:28806)
Cannot assign to read only property 'exports' of object '[object Object]'
The best option is to file an issue with the author.
Stackblitz example

"Provided module can't be loaded" error when trying to load GoogleCloud Datastore module with Nodejs 8

As part of the implementation of a Cloud Function under Google Cloud Platform, executed with Nodejs 8, I have to store information in GCP Datastore.
I use TypeScript which is compiled in Javascript.
I have the following error when I try to import the "#google-cloud/datastore" module:
Provided module can't be loaded. Is there a syntax error in your
code? Detailed stack trace: TypeError: extend must be a string
I tried 2 ways to import the module and each time I get the same error:
import {Datastore} from '#google-cloud/datastore';
const datastore = new Datastore();
or
const datastore = require('#google-cloud/datastore');
I also tried to install different versions of the module, nothing helps.
Finally, I realized that even when the module is not installed (I executed the command npm uninstall #google-cloud/datastore), I get the exact same error when logically, when we try to import a module which is not installed, we should have the following error:
Provided module can't be loaded. Did you list all required modules
in the package.json dependencies? Detailed stack trace: Error:
Cannot find module 'test'
Has anyone ever encountered this problem or would have a clue why I get this error?
I faced the same issue while deploying the functions, later I realized that I installed the packages in wrong location.
My folder structure was this:
/
functions
node_modules
index.js
...
By mistake I installed all the packages at / level:
/
functions
node_modules
index.js
...
node_modules
So all my packages were in the outer node_modules.

Can't use lib after import via npm

I'm trying to use flexibility lib inside my Laravel projet. So I ran npm i flexibility --save and require it inside my app.js file:
require('flexibility/flexibility.js');
...
flexibility(document.documentElement);
But I receive an alert:
Uncaught ReferenceError: flexibility is not defined
Require the name of the package, and set it in the window object
In bootstrap.js
window.flexibility = require('flexibility');
And in app.js or from the console
flexibility(document.documentElement);
Hope this helps

angular js injector module error while using 'angularFileUpload'

Am using AngularJS v1.6.4 for my node app
later i hv installed angular-file-upload from npm
when ever i add angular.module name 'angularFileUpload' it get's ( master.js:26 Uncaught Error: [$injector:modulerr] )
master.js is collection of js (jquery,angular,slimscroll,toaster etc..);
var LifeApp = angular.module('LifeApp',['ui.router','ngRoute','ui.grid','ui.grid.selection','angularFileUpload']);
once i start the node app Uncaught Error: [$injector:modulerr] found.
Have you required/imported the module? Installing a package only adds it to the node_modules folder, after that you need to require it inside your application like require("angular-file-upload");.

Javascript error in simple Aurelia ASP.Net 5.0 RC1 Setup

I am attempting to setup a very basic Aurelia project in ASP.Net 5.0 RC1. I am getting the following JavaScript error after doing a basic initial setup. I am using TypeScript.
Unhandled promise rejection Error: XHR error (404 Not Found) loading http://localhost:5392/core-js.js
Error loading http://localhost:5392/core-js.js as "core-js" from http://localhost:5392/jspm_packages/npm/aurelia-loader#1.0.0-beta.1/aurelia-loader.js
at o (http://localhost:5392/jspm_packages/system.js:4:12694)
at XMLHttpRequest.s.onreadystatechange (http://localhost:5392/jspm_packages/system.js:4:13219)
(anonymous function) # es6.promise.js:138
The setup I did is as follows.
Create Empty ASP.Net 5.0 template.
Install Microsoft.AspNet.StaticFiles from nuget and set up app.UseFileServer.
From git bash run jspm init with the following settings.
Package.json file does not exist, create it? [yes]:
Would you like jspm to prefix the jspm package.json properties under jspm? [yes]:
Enter server baseURL (public folder path) [./]:./wwwroot
Enter jspm packages folder [wwwroot\jspm_packages]:
Enter config file path [wwwroot\config.js]:
Configuration file wwwroot\config.js doesn't exist, create it? [yes]:
Enter client baseURL (public folder URL) [/]:
Do you wish to use a transpiler? [yes]:
Which ES6 transpiler would you like to use, Babel, TypeScript or Traceur? [babel]:typescript
From git bash run jspm install aurelia-framework and jspm install aurelia-bootstrapper.
Add the index.html, app.html, and app.ts file from the aurelia docs.
Fire up IIS Express, load page, get error.
Is there a step I am missing in this setup?
It seems like this is a known issue. The fix is somewhat simple. If you add a core-js mapping at the top of the map section in config.js, it fixes it.
For example,
map: {
"core-js": "npm:core-js#1.2.6",
// other mappings
}

Categories