Cannot find module 'angular' inside angular 2 project - angularjs

I'm using angular-cli, typescript, trying to downgrade angular2 component, so it will work inside angular 1.5 project but the module is not recognize. What I'm missing?
// Angular 1 Vendor Import
import * as angular from 'angular';

This was solved by:
npm install #types/angular

Related

Can not find namespace 'angular'

I have an hybrid angular app with Angularjs 1.5.8 and angular 5.2.9. I had followed the steps from the Upgrading from AngularJS to Angular. It is working perfectly fine.
However, after I upgrade angular 5.2.9 to angular 6.0.1, I am getting error during ng serve.
error TS2503: Cannot find namespace 'angular'
As mentioned in the Upgrading from AngularJS to Angular I have declared 'angular'
declare var angular: angular.IAngularStatic;
While upgrading angular from 5.2.9 to 6.0.1, I followed the steps from Angular Update Guide - 5.2 -> 6.0 for Advanced Apps
How can I resolve this problem?
try npm install --save-dev #types/angular
if not try the following:
you need to add "angular" types to tsconfig.json
...
"types": [
"angular"
],

Configuring ui-grid using webpack

I am new to Webpack and node. Need help in configuring ui-grid.
I wanted to bundle angular using webpack, So I installed angular using npm and after installing I could see index.js file inside angular folder in node_modules, which actually export angular module. To include angular module I include following line in entry file of webpack.
const angular = require('angular');
And it works fine. Now I am trying to do same thing for ui-grid but I could not find index.js file there which actually imports ui-grid module.
Please provide pointers about how to include ui-grid and what is the concept of index.js.

Inject ngMaterial using webpack, angular fullstack generator

I want to build a web application and I have started building this by using the angular fullstack generator. This generator uses webpack and this is the first time I am using webpack.
I have been trying to add the ngMaterial dependency by installing it with:
npm install angular-material --save
I have added the dependency in the config.entry.vendor from the webpack.make.js file but when I tried to import the ngMaterial i received the following error:
ERROR in ./client/app/app.js
Module not found: Error: Cannot resolve module 'ngMaterial' in path\client\app
# ./client/app/app.js 21:18-39
How can I inject a dependency with webpack?
I assume you pointed incorrect dependency name in webpack configuration: ngMaterial instead of angular-material.
ngMaterial is angularjs module name, you point it as a dependency in your angular app module, like this:
angular.module('app', ['ngMaterial'])
But in webpack dependencies you have to point node.js module name, which is angular-material (it is located in node_modules folder after you install it via npm install command)
EDIT:
If needed in your app.js you also have to import that module via import 'angular-material' or require('angular-material'). But if you include this dependency in separate vendor.js file (via webpack), than you shouldn't ever include this module in your app.js, cause it will upload to the page in vendor.js. You'll include it 2 times in your project if you do so.

Using angular from both atmosphere and npm gives warning

Using Meteor 1.3.2.4 I do:
meteor create myapp
cd myapp
meteor npm install --save angular
meteor add angularjs:angular
and in main.js add as first line
import angular from 'angular';
This gives me
WARNING: Tried to load angular more than once.
in the browser console.
I guess this is because angular packages from both npm and atmosphere are added, but I do not know how to circumvent this if I need an atmosphere package that depends on angularjs:angular and also want to to use angular from npm (for example when using angular-meteor). More specifically I want to use the package angular-leaflet-directive in a meteor/angular app. Any suggestions ?
I asked the same question here.
The package author needs to follow those instructions here to make his package work on both Meteor 1.3 and Meteor 1.2 and earlier.
Maybe you could submit a pull request for him and until he will merge it, you could publish to Atmosphere under your own user.
Also, you could just bring angular-leaflet-directive from npm!

Using npm on Meteor 1.3 + angular1 (bump!)

Edit note:
I am changing this question as I progress. Will continue to update.
I've upgraded my angular-meteor project (Meteor 1.2.1 + jade + ES6 js) to 1.3. The update was successful and everything works as before. I'd like to start using npm to install angular plugins as in:
meteor npm i <package>
As a first step, I've installed angular and angular-meteor:
meteor npm i angular --save
meteor npm i angular-meteor --save
then added:
import angular from 'angular';
import 'angular-meteor';
I've got a few missing packages errors on the server side, and fixed those by adding them using npm i <package> --save
Now I'm bumping against:
Error: Can't find npm module 'ecmascript'. Did you forget to call 'Npm.depends' in package.js within the 'modules-runtime' package?
W20160410-21:27:53.530(3)? (STDERR) at Object.Npm.require (/Users/user/work/myproj/.meteor/local/build/programs/server/boot.js:195:17)
Ideas?
Update
I assumed that adding ecmascript would fix it, but the error happens when it's installed. To be clear, I wasn't sure if to meteor add ecmascript or to meteor npm i ecmascript so tried both, separately and together. Nether fixed the above error.
That being said, meteor add ecmascript actually got ES6 errors to stop, so I know it's there and active
2nd-Update (3 weeks later)
Waiting and retrying the update after a couple of weeks solved it: I've run Meteor update then run the server, which in turn errored a few times about missing npm packages but after [meteor] npm install of those, everything worked like a charm. Problem solved!
In previous version of Meteor Angular we removed ecmascript if you're migrating, add it back
meteor add ecmascript
Here are the steps that worked for me:
1. meteor update
2. review the packages that did not upgrade and upgraded them. Specifically the ones shown bellow:
The following top-level dependencies were not updated to the very latest version available:
* angular 1.3.7 (1.3.10 is available)
* angular-meteor-auth 0.2.2 (1.0.2_1 is available)
Newer versions of the following indirect dependencies are available:
* angular-meteor-data 0.3.0 (1.3.10 is available)
* angular-templates 1.0.1 (1.0.2 is available)
* pbastowski:angular-babel#1.3.4
meteor npm init (and fill all details)
npm install --save angular angular-meteor
added the following import on app.js (main app file): import angular from 'angular';
(I added also import angularMeteor from 'angular-meteor';, but it does not seem to be necessary).
I received one strict-di error which I fixed by adding 'ngInject'; to that function (RoutingHandler).
That made my project work as before (no new npm packages, no extra imports).

Resources