I am a little new to angular-meteor and want to add an external js library to my project.
The library is Fusioncharts.js http://www.fusioncharts.com/angularjs-charts/#/demos/ex1 and it cannot be installed using any of these options
1) bower install
2) npm install
3) meteor add (from atmosphere)
So what i did is, I followed these steps How can I add third-party JavaScript libraries to a Meteor application?
and added the libraries manually under public/js directory
Created a main.js file and added all the scripts using $.getScript
Strange thing is when I add the dependency of the 'ng-fusioncharts' module in my angular.module it throws an error
" Module 'ng-fusioncharts' is not available! You either misspelled the module name or forgot to load it."
Please let me know what could be going wrong here.
P.S : When I type in FusionCharts in the console.log I do see that object.
So it means the Fusioncharts libraries were imported properly but not added to the angular dependency
Thanks in advance
Please note that $.getScript is asynchronous, so you would need a little timeout to wait for the module to be available to the rest of your code.
Another possibility to try out would be to include your script rather in client/compatibility special folder. It will be included in your JS and execute before the rest of your client JS code.
Related
I'm using scala.js to create javascript code to be run in a browser, served up by an akka-http server. I had it mostly working using mill as my build tool, but then wanted to switch to sbt so I could use the ScalaJSBundler plugin for npm dependencies and packaging. Using sbt, when I do a fastOpt to compile my scala.js code, javascript code is created slightly different than what mill created and it now includes require statements (which the mill build didn't) such as
var $i_react = require("react");
When this code is run in my browser require comes up as undefined. Also variables I have exported in scala.js come up as undefined. I thought this was because the code being created was for ModuleKind.CommonJSModule (set via the sbt setting scalaJSModuleKind), but when I try to change that to ModuleKind.ESModule the build fails with:
scalaJSModuleKind must be set to ModuleKind.CommonJSModule in projects where ScalaJSBundler plugin is enabled
I'm new to javascript (and scala.js). What am I doing wrong? How should this be done?
Thank you!
As described in the Getting Started of scalajs-bundler, you should serve the result of webpack/fastOptJS to the browser, instead of fastOptJS. This is necessary because the latter is emitted as a CommonJS module, unsuitable for the browser, but then processed by Webpack to produce the former, a bundle suited for the browser, also containing the npm dependencies.
I am learning Mantra style guide (https://kadirahq.github.io/mantra/) to use with meteor. What puzzles me is what is the "correct" way to use external template with meteor and mantra? in example css and js files. I know that in meteor one can create a package and load it.
But should one also do the same in meteor + mantra, i.e. create a package as https://github.com/kadirahq/mantra/issues/53 suggests? Will meteor then load all necessary files (css or js) correctly? Or is there a better way?
Best Regards
Mantra follows modular structure. Your code will be in the form of module doesn't matter its UI related or not. It will load things like meteor application but application will start from starting point you have defined.
Yes you can create a package and load it from there but when you have npm package in your hand which you can directly use in you modules, I think creating package will be a bad idea for that.
In the project with mantra I had worked, we used rebass. We had created some common components for UI purpose only and added them to a separate module and exported them from index.js. In every module we called components from that module and used it whenever required. Better way is to use npm packages so that you wont have to worry about loading JS.
I recently updated my Meteor App to 1.3 and also want to migrate to the "new style" of coding, meaning ES2015, React, later on Apollo/GraphQL.
First I only want to use the import syntax. But when I meteor add Ecmascript it will then hang on meteor:
Building for web.browser /
takes forever.
Any ideas why?
I had the same issue. In my case this is how I got it fixed. May be it is the same for you.
I had multiple third party libraries in client/lib folder.
To use ES6 syntax, I added 'ecmascript' to my .meteor/packages file and after that issuing the meteor command would just hang.
During trial and error, I figured out that
deleting the client/lib directory made meteor to start
.
For the libraries my application depends on, I went to https://atmospherejs.com, searched for the meteor specific package name for the dependency and added these to .meteor/packages file.
e.g: Instead of copying the datatables.js and datatables.css inside client/lib folder, add 'menway:jquery-datatables' to .meteor/packages or issue the command meteor add menway:jquery-datatables
I'm using angular-meteor library to develop a meteor application with angular as a front-end.
I need to add an angular directive called angular-file-upload.
When I use this directive in my node/angular app, it is installed via bower, and has this folder structure:
angular-file-upload folder contains
angular-file-upload.js
as well as a sub-folder named src,
which contains 3 files:
intro.js, module.js and outro.js
What is the process of installing such third party angular directives?
Is this done with meteor add command, or by placing these files manually into specific directories?
Check out this link, if those are the actual packages which serve your purpose then you can directly add them to you Meteor app by using meteor add <package-name> command in the terminal.
While the alternate way to do this is by adding these .js files manually to public or lib folder and link them to your corresponding HTML pages. But I would personally prefer the 1st way to do this.
You can create the library by yourself. There are few alternatives to do that.
Basically it goes down to these steps:
add package.js in root directory
meteor publish --create
The complete details how to do that can be found here: http://angular-meteor.com/tutorial/step_19
I want to build a meteor package to wrap an existing javascript library. I would like to include the library as a git submodule. I only need 2 files from the submodule. If I only include these two in package.js will the rest of the files be ignored by meteor and not built into the package?
The only files that will end up in your package are those that will be explicitly added with api.addFiles routine (look here).
BTW, If you're planning to wrap an existing JavaScript library then you should probably start by getting familiar with autopublish project. For more details watch this video.