I am writing an angular2-meteor program.
When I am using urigo:angular2-meteor package, I add reference path like this:
/// <reference path="../typings/angular2-meteor.d.ts" />
The question is: can I use other normal meteor packages in a angular2-meteor project? Or I can only use some packages written for angular2-meteor specifically.
For example, if I want to use yuukan:streamy, how can I use it correctly? Right now, I have one line code
Streamy.broadcast('hello', {data: 'world!'});
When I compile it, it shows: Cannot find name 'Streamy'.
Thanks!
you can use all the libraries from meteor.
you will have 2 choices.
find the streamy definition file (streamy.d.ts) if it exists. This will give you autocompletion and compile errors if you misuse streamy functions.
If you dont find a definition file than just add declare var Streamy at the top of the file you want to use it. The library is already there if you add it via atmosphere. But typescript does not know about it. By declaring the variable you tell typescript that this exists and it wont complain when compiling.
Related
I just started experimenting with Nativescript and am using the Playground to test things and see how it works.
What I wanted to do: add the moment.js module for formatting date/time
What I tried:
1. added the moment package. This appears to have worked because Playground now shows the moment folder along with files (package.json, ender.js, moment.js, etc) and subfolders.
2. In my code I used this snippet to require "moment"
var Moment = require("moment");
This failed though because I get an error of
Error: Could not find module 'moment'. Computed path '/var/mobile/Containers/Data/Application/xxxx/Documents/Playground/LiveSync/app/tns_modules/moment'
Any suggestions on what I need to change to get it to find 'moment'? I checked in package.json and it has the name as "moment".
The default require statement will search for the module form the tns_modules directory that was packed with the app during build time. So with Playground you could use relative path.
For example, if you want to use it on app.js which is in the root level,
var Moment = require('./moment');
You know, I spend more time just trying to get things set up to work with Angular than I do actually developing with Angular. There must be an easier way... :(
Currently, I am using the aspnetcore-spa template, creating a project with the command "dotnet new angular" - this is version 1.0.3, which adds Angular 4.1.2 to the npm dependencies. This works great to get a project running quickly. But now I want to add PrimeNG to take advantage of their form controls. I have been struggling with this all day, and would love it if anyone could provide some assistance.
Here is what I have done in my current effort (the latest of many, starting fresh each time):
1) Added to the package.json file: "primeng": "4.1.0-rc.2"
2) Added 'primeng/primeng' to the webpack.config.vendor.js file's vendor collection.
3) Added the following to my test module (which is in turn referenced in app.module.shared.ts so I can route to it via my RouterModule):
import { FileUploadModule } from 'primeng/components/fileupload/fileupload';
And in the html for the module, in an attempt to use the file uploader control, I have (from their site - https://www.primefaces.org/primeng/#/fileupload):
<p-fileUpload name="myfile[]" url="./upload.php"></p-fileUpload>
4) ran "webpack --config webpack.config.vendor.js" from a command prompt at the root of the project folder, which completed with no errors.
Then I hit F5 to run the project, and I got this error:
Exception: Call to Node module failed with error: Error: Template parse errors:
'p-fileUpload' is not a known element:
1. If 'p-fileUpload' is an Angular component, then verify that it is part of this module.
2. If 'p-fileUpload' is a Web Component then add 'CUSTOM_ELEMENTS_SCHEMA' to the '#NgModule.schemas' of this component to suppress this message. (" type="button" (click)="onclick()" class="ui-button-info" label="Click Me">Click Me</button>-->
So, in an effort to comply, I added a reference to the ngprime module to the app.module.shared.ts file, like this (I don't really know how I should reference the module...):
import { FileUploadModule } from 'primeng/primeng';
But got the same exact error.
What am I missing???
Any help would be most appreciated.
I finally have this working, using the asp-prerender-module to get server-side rendering, and not having to rely on the asp-ng2-prerender-module (see my last comment). The trick, I found, was to reference the FileUploaderModule in the app.module.shared.ts file like this:
import { FileUploadModule } from 'primeng/components/fileupload/fileupload';
rather than like this:
import { FileUploadModule } from 'primeng/primeng';
The reason this matters is that the latter method of referencing will load all other components as well (see explanation here: https://www.primefaces.org/primeng/#/setup), and SOME of the PrimeNG components can not be rendered on the server due to DOM-related references (things like "window", which do not exist on the server). See the discussion here for more on this: https://github.com/primefaces/primeng/issues/1341
This change, combined with the other steps listed in my answer and, of course, actually referencing the directive in app.module (thank you #pankaj !) made everything work correctly at last. Only took me about 7 hours to figure it out. :(
I'm using Flow to help author a JS project. If I want to provide a libdef file to supplement it do I need to create it manually, or am I able to execute some magic command that I'm not aware of yet which will generate the lib def for me?
Something like $ flow-typed doyourmagic would be nice.
EDIT:
Found this https://stackoverflow.com/a/38906578/192999
Which says:
There's two things:
If the file is owned by you (i.e. not a third party lib inside node_modules or such), then you can create a *.js.flow file next to it that documents its exports.
If the file is not owned by you (i.e. third party lib inside node_modules or such), then you can create a libdef file inside flow-typed/name-of-library.js
For .js.flow files
you write the definitions like this:
// #flow
declare module.exports: { ... }
For libdef files you write the definitions like this:
declare module "my-third-party-library" { declare module.exports: {... } }
For my question I fall into the "is owned by you" camp.
I guess I'm confused as to:
How I write these files.
How/where I publish these files to package it up for another project to reference.
Also, why do I need to create the .js.flow file manually? Can this not be magically generated? Perhaps that's the intention going forward but not implemented yet.
I found a nice guide showing how to package flow code together with the compiled code. So:
You do not have to write your own libdefs, you can use the entire flow source code. If you want a definition with only the type declarations, you can look into flow gen-flow-files, although that is still experimental and might fail.
You can package them as *.js.flow and the flow checker will automatically pick those up when you import your library.
I'm trying to take advantage of Google Closure Compiler minification by writing a database script of my own and compiling it with the pre-compiled ydn. To get a basic first version working I'm trying to rewrite the todo list demo from the project. Unfortunately, I don't understand how to keep namespaces for ydn functions preserved in the compiled output file.
Here's what I've written so far: http://pastebin.com/6YhnRuD5
When the code compiles in advanced mode, the "ydn.db.Storage" from "db = new ydn.db.Storage(dbName, Schema)" gets munged into "ydn.db.c$" making it unusable. The goog.exportSymbol at the bottom of the file doesn't seem to save the function names either.
Does anyone know how to rewrite this with Google Closure Compiler? Should this be compiled directly with the ydn source code instead?
The goog.exportSymbol at the bottom of the file doesn't seem to save the function names either.
It should.
goog.exportSymbol("ydn.db.Storage");
should be
goog.exportSymbol('ydn.db.Storage', ydn.db.Storage);
I want to use SoundFacade class from Adobe. (Here, from github). I simple created an "ActionScript File" and paste all the code. But when I want to compile my app I got following error:
1037: Packages cannot be nested.
The only reason I can guess is that the package must somehow put into the project or something.
EDIT:
Even when I just put a simple empty package I got the error:
package {
}
How to Reproduce the bug?
Create a new Flex Mobile Project.
Click New > ActionScript File
type package { }
include new package in one your views
code:
<fx:Script source="../SoundFacade.as" />
You will get the error
I find the solution. I was actually unaware of the package naming rule. Here is the answer to this problem: http://forums.adobe.com/message/4299377
The tag will insert your
SoundFacade.as file into the MXML file (similar to an include in
C/C++). That will cause an invalid syntax.
Give your package a name (in this case it should be called SoundFacade
because that is the name of the folder it is in) then use the import
statement inside your script tag. Make sure you adhere to the
recommended file, namespace, package and class naming structure.
That's usually a reverse-DNS style: com.adobe.utils.bla.bla.bla.
If package name is blank and the source is in the default folder, you
don't need to import it.