Using npm on Meteor 1.3 + angular1 (bump!) - angularjs

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).

Related

SCRIPT438: Object doesn't support property or method 'setPrototypeOf'

I've created a react app using "create-react-app" command and updated all packages in package.json, App was not working in IE(any version) but after adding #babel/polyfil dependecy, it worked with IE-11, but facing problem with IE-10 and older version.
SCRIPT438: Object doesn't support property or method 'setPrototypeOf'
Create React App requires polyfills to work on Internet Explorer. You should follow the official guide to make it work on IE 9, 10 or 11. At the time of this writing it requires the following steps:
Install react-app-polyfill via npm or yarn.
npm install react-app-polyfill
Import it in your code:
import 'react-app-polyfill/ie9';
// or
import 'react-app-polyfill/ie11';

Jest fails with error: Cannot find module 'react/lib/ReactComponentTreeHook'

I have installed Jest v17.0.3 in my react project.
When I run jest locally it works fine, but on the build server it fails with:
Error: Cannot find module 'react/lib/ReactComponentTreeHook' from 'ReactDebugTool.js'
Both machines are running node version 6.9.1 and npm version 4.0.2.
use same version of react and react-dom. My problem fixed after using this command
npm install --save react#15.4.0 react-dom#15.4.0
this problem specially occurs on react 15.4.0 above.
Can you check which version of React you are using? Is it the same on both servers? I would try removing node_modules and reinstalling the dependencies. The reason I am suggesting this is that in React v15.4.0 you cannot import private apis and it seems that ReactDebugTools.js is trying to import from react/lib/....
From the blogpost about React v15.4.0 (Link):
However, there is a possibility that you imported private APIs from react/lib/*, or that a package you rely on might use them. We would like to remind you that this was never supported, and that your apps should not rely on internal APIs. The React internals will keep changing as we work to make React better.
Hope this helps!
In the latest versions of react we often see this error as we have loaded 2 versions of react:
To make sure you have just 1 version, run the following in your terminal:
npm ls react-dom
npm ls react
Both the react and react-dom versions need to be same.
If any one of these returns more than 1 version then that's not supported. You have to then correct it in your corresponding package.json
I had the same issue and i removed the node_modules and ran npm install and it fixed the problem.

Problems updating to React 15.4.0

I'm getting this error with in all my files:
Module not found: Error: Cannot resolve module 'react/lib/ReactMount' in...
I'm using the latest version of react: 15.4.0.
webpack: 1.12.11
Any help?
One quick solution to this will be use npm to install reactjs.
npm install --save react react-dom
Don't use standalone react bundle.
More solutions can be provided if you post your webpack config file.
The problems seems to be located in react-hot-loader library.
As mentioned #gaereon in my react gitub post, apps should not rely on internal APIs. So, react-hot-loader is using ReactMount.
I asked to fix it, for now I will return to latest version of React.
UPDATE
I had the 1x version. I switched to 3x beta version and works fine.

Install bower component (angular-qr-scanner) using Meteor

I'm trying to install Angular QR Scanner in my Meteor app. It seems the only way to install it is using Bower, however bower support for Meteor seems to be deprecated now for 1.3. I tried installing using npm install however I receive an error that qrcode.decode is not a function, despite importing both files needed.
Is there another way to install bower components using Meteor?
Ended up just importing the plain javascript implementation with html5-qrcode rather than using an angular directive.

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!

Resources