I need to implement 3rd party rest API in php project for integrating another project which is in angular.
Using rest API, I need to store cookie in the browser and cookie value will be in a specific format as instructed for which I need to import a specific npm package called angular2-cookie inside my root directory from
https://github.com/salemdar/angular2-cookie/blob/master/src/services/cookies.service.ts
I successfully installed it using npm command inside root directory.
In /js/sample-script.js
I imported the specific cookies.service.js file from that angular2-cookie module using browserify lib like
var CookieService = require('../node_modules/angular2-cookie/services/cookies.service');
var cs = new CookieService();
cs.putObject('somecookie',{user: 'john'});
but in the console, I am getting an error like:
Uncaught TypeError: CookieService is not a constructor
How can I implement putObject method from CookieService prototype?
Note: There is no error coming till 1st line where I used require method
Related
I'm trying to use the postal-mime JS library in a Chrome browser extension using Manifest V3. My extension spawns a service worker and I'm trying to use this library there. To import it, I tried both
const { PostalMime } = require("postal-mime");
and
import { PostalMime } from "postal-mime";
while my code looks like this:
const parser = new PostalMime();
parser.parse(result).then((email) => console.log(email));
The variable result contains a standard email message as a string that I'd like to parse.
In both cases, I get the following error:
Uncaught (in promise) TypeError: PostalMime is not a constructor
at sw.js:66:1
(anonymous) # sw.js:66
Promise.then (async)
(anonymous) # sw.js:61
What am I doing wrong?
Thank you for your help,
GTP
This is not a ES module so to import it in general you need to use webpack or browserify i.e. a build system for your extension. Luckily, in this case you can find a prebuilt js file on unpkg.com which you should download manually into the directory of your extension.
import './postal-mime.js'; // path and .js suffix are required for native import!
const PostalMime = postalMime.default;
const parser = new PostalMime();
parser.parse(result).then((email) => console.log(email));
Note that since postal-mime.js is not a native ES module we used a nameless import to let the library create its export in a global variable. To see the name of the variable (postalMime) look at the beginning of the file where you'll see exports.postalMime=. As for default it is an internal mechanism used by npm module implementation, which you can see in devtools console when you inspect postalMime object. Other libraries may use multiple named properties instead.
I ended up using the library emailjs-mime-parser. While not a real solution to the asked question and despite having fewer functionalities than postal-mime, at least I'm able to import it out of the box without thinkering with Webpack's config.
Hi all I am doing quasar project and I need to access JSON file that is on server.
I'm trying this:
Import MyVar from "http://myserver/files/MyVarfile.json"
But whenever I try it it gives me error:
The target environment doesn't support dynamic import() syntax so it's
not possible to use external type 'module' within a script. Did you
mean to build a EcmaScript Module ('output.module: true')?
I'm attempting to make use of this library: https://github.com/MagicTheGathering/mtg-sdk-javascript in an Angular2 application.
Unfortunately, I've been going in circles trying to load it into my application.
Firstly, on the TypeScript side if I import it using:
import { } from 'mtgsdk';
there are no types to load into the {}.
If I attempt to load it using something similar to:
import * as mtg from 'mtgsdk'
I'm unable to because it says that it's unable to find a module named mtgsdk.
I've installed the module using
npm install --save mtgsdk
Also, npm installs work fine for other modules.
The application compiles fine if I load it in using require via something similar to this:
var mtg = require('mtgsdk');
Taking that approach, I'm able to compile and launch but in the browser I get a number of errors about modules that it can't find. I figure they are prerequisites for the sdk that didn't get loaded so I start bringing them in via package.json.
For every one that I bring in, I then have to go to systemjs.config.js and add an entry pointing to the module's entry point and often have to specify a default extension using blocks like this:
pointer
'mtgsdk': 'npm:mtgsdk/lib/index.js',
'request-promise': 'npm:request-promise/lib/rp.js',
'ramda': 'npm:ramda/dist/ramda.js',
'emitter20': 'npm:emitter20/index.js',
'bluebird': 'npm:bluebird/js/browser/bluebird.js',
'request': 'npm:request/index.js'
default extension
'request-promise':
{
defaultExtension: 'js'
}
I'm not sure if that's the right approach though because the more dependencies I add, the more that I end up requiring. At one point I had literally gotten up to 50 extra dependencies added because every time I launched, the browser console would find more that were needed.
Is there any easier way to load all of these in?
Also, some of them (such as tough-cookie and request-promise-core) were very problematic to load and I couldn't get the browser console to stop complaining about them. Finally, some of them seemed very basic such as url, http, https. Those seem like they should already be present.
Using systemjs was utilized in the previous versions of Angular 2, However Angular 2 has evolved to Angular 4, with super new features like Angular CLI.
I recommend your use Angular CLI, with #angular/cli.
Importing Node modules
Since mtgsdk is a node-module, you can easily import it using
import * as mtg from 'mtgsdk'
However for your program to compile, you must install a type definition for it. or declare one for it in /typings.json or your app might not build.
Importing Client Scripts
For client scripts like firebase.js you won't need to add client scripts as entries in systemjs.config.js again.
Using #angular/cli, you would easily add them in the scripts[] array in your angular-cli.json for automatic compilation.
Then access them like this
declare const firebase: any;
Here is a quickstart tutorial to set up Angular with #angular/cli.
I forked Brackets, because I'm planning to make a code editor fully integrated if Steam. To do so, using Javascript, I add a git submodule on the thirdparty folder to use the greenworks repo (a solution to make Steamworks work with Javascript). I loaded this module on brackets.js, like so:
// Load greenworks module
var greenworks = require("thirdparty/greenworks/greenworks");
But when I call it, either on my extension, or even on console, it says:
[Extension] failed to load C:/Program Files (x86)/Brackets/dev/src/extensions/dev/greenworks - Error: Module name "/thirdparty/greenworks/greenworks" has not been loaded yet for context: _
or
Error: Module name "/thirdparty/greenworks/greenworks" has not been loaded yet for context: _
Besides brackets.js, where else should I call greenworks module before I use it (on a extension, or on the console for testing purposes)?
I'm trying to build a functional test using CasperJS.
caseperjs is run by a backend test suite using the following command:
PHANTOMJS_EXECUTABLE=../client/node_modules/phantomjs/bin/phantomjs ../client/ext_modules/casperjs/bin/casperjs test ../client/test/functional/init.coffee
In init.coffee I want to import/include other module (file) which seats just next to it. How to do it?
The following doesn't works:
require("user")
All I want is to get a content from other file into init.coffee
After trying a number of the other suggestions (each expected to work in the context of their corresponding environments), hit on this solution:
phantom.page.injectJs( 'script.js');
As of 1.1, CasperJS relies on PhantomJS’ native require():
https://groups.google.com/forum/#!topic/phantomjs/0-DYnNn_6Bs
Injecting dependencies
While injecting additional modules, CasperJS looks for path relative to cur directory
(the place where we run a casperjs command)
We can inject dependency using clientScripts option. However the injected dependencies can't
use require "globally". They are injected immediately to every page loaded.
casper.options.clientScripts = ["path/relative/to/cur/dir"]
Also we can inject modules using commandline args:
casperjs test --includes=foo.js,bar.js path/to/the/test/file
Using require
To import user modules use:
require "./user-module.coffee"
Then in user modules you can also use require. Using require paths are resolved
relative to the current file (where require is called).
If in user module you want to import casper libs, then you need to patch require,
check: https://casperjs.readthedocs.org/en/latest/writing_modules.html
There's a section about that in the docs
var require = patchRequire(global.require);
require('./user');
In your case you should use global.require since you're using CoffeeScript.