I'm trying to upgrade an Angular1.4.0 app to use the latest angular-ui-router, but I can't figure out how to reference this package in code. I'm using webpack 1.12.9 and node 6.10.2. I've installed package "#uirouter/angularjs" version 1.0.3.
Using CommonJs modules, the following used to work with version 0.2.14:
require('angular-ui-router')
I've tried variants of the following, but with no luck:
require('#uirouter/angularjs/lib')
I am getting the error:
Error: [$injector:modulerr] Failed to instantiate module {"core":`{"services":{},"Category": ..... (remaining stack omitted)
Any ideas?
May be this is necroposting but:
I am facing with same issue right now so here is the answer:
Try to use uiRouter.default package when register dependencies.
Like here:
import * as uiRouter from 'angular-ui-router';
const dependencies = [uiRouter.default];
const app = angular.module('app', dependencies);
Related
I ran create-react-app.
Made no changes and ran the tests.
The tests failed straight away.
Error: Failed to initialize watch plugin "node_modules/jest-watch-typeahead/filename.js":
● Test suite failed to run
file:///C:/_Projects/my-app/node_modules/jest-watch-typeahead/build/file_name_plugin/prompt.js:4
import { PatternPrompt, printPatternCaret, printRestoredPatternCaret } from 'jest-watcher';
^^^^^^^^^^^^^
SyntaxError: The requested module 'jest-watcher' is expected to be of type CommonJS, which does not support named exports. CommonJS modules can be imported by importing the default export.
For example:
import pkg from 'jest-watcher';
const { PatternPrompt, printPatternCaret, printRestoredPatternCaret } = pkg;
at async requireOrImportModule (node_modules/jest-util/build/requireOrImportModule.js:65:32)
at async watch (node_modules/#jest/core/build/watch.js:337:34)
at async _run10000 (node_modules/#jest/core/build/cli/index.js:311:7)
What the deuce?
Can anyone please help?
This is a known issue and is related to the version of node you are using. Check out https://github.com/facebook/create-react-app/issues/11792.
Resolve it by upgrading to the latest node version >16. This worked for me. https://nodejs.org/en/download/
I'm working on a project with Ionic v1 and AngularJS and Cordova.
I'm trying to include this firebase plugin in my project with no luck so far: https://github.com/dpa99c/cordova-plugin-firebasex
I was told to try out this node module: https://github.com/ionic-team/ionic-native#angularjs
However, I keep getting this error:
Error: [$injector:nomod] Module 'ionic.native' is not available! You either misspelled the module name or forgot to load it. If registering a module ensure that you specify the dependencies as the second argument.
<script src="../node_modules/#ionic-native/core/ionic-native-plugin.js"></script>
How can I make this work in my project and how can I import ionic-native properly?
Actually, I'm using ionic-native 5.23.0 in my angularJS project and I believe all 5.x versions have support for this angular version. If you take a look in ionic-native/core you will notice that exists a file called ng1. That file have a function called initAngular1 who iterate across object's properties creating angularJS services. Here's what I did.
First, I opened the script that I use as entry point in my webpack.config to create a bundle (Since I already had webpack installed, I used)
Inside this script, I wrote the following:
require('#ionic-native/core');
const appVersion = require('#ionic-native/app-version');
const sqlite = require('#ionic-native/sqlite');
const statusbar = require('#ionic-native/status-bar');
const toast = require('#ionic-native/toast');
const ng1 = require('#ionic-native/core/ng1')
ng1.initAngular1({
AppVersion: appVersion.AppVersion,
SQLite: sqlite.SQLite,
Statusbar: statusbar.StatusBar,
Toast: toast.Toast
});
Run webpack
Inject ionic.native module in your app.
Inject any plugin you would like to use with a $cordova prefix.
angular.module('myApp', ['ionic.native'])
.controller('MyPageController', function($cordovaToast) {
$cordovaToast.show('Hello from Ionic Native', '5000', 'center');
});
Don't forget to install the cordova plugin used by the ionic-native plugin.
ionic-native stopped the support to angular ionic v1/angular 1,
https://github.com/ionic-team/ionic-native/tree/v3.x
For Ionic V1/Angular 1 support, please use version 2 of Ionic Native. See the 2.x README > for usage information.
I'm following using this codesandbox as a guide with my React project and receiving this error:
./node_modules/scrollmagic/scrollmagic/uncompressed/plugins/animation.gsap.js
Module not found: Can't resolve 'TimelineMax'
Assuming I copied everything from that sandbox to my local files, why am I getting that error?
I'm using Create-react-app btw.
animation.gsap.js requires TimelineMax module so try importing 'TimelineMax' module
import { TimelineMax} from 'gsap/src/uncompressed/TweenMax.js';
also you can refer to github solution
I'm trying to use google maps api in my react app using webpack and typescript.
i've tried installing this package:
npm install googlemaps
npm install #types/googlemaps
Then in my app
import * as GoogleMapsAPI from 'googlemaps';
I get the following error
[ts] File 'c:/MyAppFolder/node_modules/#types/GoogleMaps/index.d.ts' is not a module.
Not sure what I'm doing wrong
You don't need to import from "googlemaps". google.maps is a global variable declared in googlemaps/index.d.ts. So you can use google.maps in your code right away.
For example
const point = new google.maps.Point(0,0);
For more info about typescript module and namespace. You can follow this link
this sound like a simple question but i am a newbie with angular, basicly i want to use AngularFileUpload to upload images on my website, so i did this when i initialize my app:
var app = angular.module('myApp',['ui.router'],['angularFileUpload']);
before i installed the angularFileUpload module trough npm, so my module is inside node_modules, but i get an error evertyme i start my app
error:
Failled to instantiate module due to:
'fn' is not a function, got string.
someone know what is happening?
That happens because you are injecting the modules in a wrong way.
You are inserting two arrays:
var app = angular.module('myApp',['ui.router'],['angularFileUpload']);
Instead you should insert just one array with all modules:
var app = angular.module('myApp',['ui.router','angularFileUpload']);
You should use bower instead of npm for loading your client side dependencies in AngularJs. There are following steps required to correctly load your module:
Download using following bower command
bower install angular-file-upload
Then include this library in the script tag, by providing correct location to minified js.
Last inject modules in correct way
var app = angular.module('myApp',['ui.router','angularFileUpload']);
And that's it. Please let me know if it helped you!