We have been working on an Angular project with TypeScript (Visual Studio Code). We are deploying this project as Chrome Extension in Google Webstore, it was worked fine, but two days back when we try to re-publish the extension with the latest changes, the Chrome Store reject the request with the below reason.
Your item did not comply with the following section of our Program
Policies:
"Content Policies"
Developers must not obfuscate code or conceal functionality of their
extension. This also applies to any external code or resource fetched
by the extension package.
Your item was found to have one or more files that does not comply
with this policy.
Please note that minification is allowed in the following forms:
Removal of whitespace, newlines, code comments, and block delimiters
Shortening of variable and function names
Collapsing the number of JavaScript files
For more information, please review these recommended Minification
Techniques for Google Developers.
We are build our angular project with ng build command.
Our environment parameters:
Angular CLI: 1.5.2
Node: 12.13.0
OS: win32 x64
Angular: 5.2.3
... common, compiler, compiler-cli, core, forms, http
... language-service, platform-browser, platform-browser-dynamic
... router
#angular/animations: 5.2.11
#angular/cdk: 5.2.5
#angular/cli: 1.5.2
#angular/material: 5.2.5
#angular-devkit/build-optimizer: 0.0.42
#angular-devkit/core: 0.2.0
#angular-devkit/schematics: 0.0.52
#ngtools/json-schema: 1.1.0
#ngtools/webpack: 1.8.2
#schematics/angular: 0.1.17
typescript-require: 0.2.9-1
typescript: 2.4.2
webpack: 3.8.1
Can anyone help us how to build our project so that it will be compatible with Chrome Extension policies?.
Interesting, Sorry to let you down but I'm afraid that's impossible (without authors help) to convert typescript into readable unobfuscated code.
I was looking into that, I'm afraid that your only option is to ask google to review your source code and check sum it but that will be a pain for both you and the reviewer to do every time theres an update to your extension from your side.
Your only realistic option leftout at that point will be to convert your typescript angular project into purejs angular project, using pure javascript is actually not that scary and should technically speed up different parts of the process if not all of the processes all together, a wise man once said that a good javascript developer can write code that is much more efficient and faster than a group of typescript developers, I'm afraid that's true.. the transcription process that occur when typescript compiles into javascript will always generate "machine code" or in other words unreadable obfuscated code, at least from my point of view, this is all purely my opinions based on the knowledge and exprience I gathered from the start of this computer age (Yes I lived through all of it).
So just to be clear, In it's own weird way: typescript is javascript, which means that some of the core codes like database interactions, classes, functions and html can easily be converted into pure javascript without fuz.
Check this out:
https://www.google.com/search?q=convert+angular+typescript+to+javascript
Related
I'm a recent CS grad working for a start-up. I've been tasked with adding new features to some software they bought. I've downloaded the software from AWS and have begun trying to get started but I'm having trouble with the front-end, which is built with React and bundled by Webpack.
The download left me with an old version of the front-end and minified files of the new version. I was able to use their source maps to unpack them and get the unbundled files but now I can't figure out how to rebuild it.
The old version is set up to have its dependencies installed and minified by npm. I would like to set up something similar with the new version. I've been able to add all its dependencies to the package.json file but I keep running into errors, mostly stemming from versioning conflicts. What should I do in this situation? Am I just going about this the wrong way?
Software might be a vague term to describe what you have in your hands.
It seems from your wording that you have the source code of an older version, but the production build (bundle.js, main.chunk.js, etc) of some newer version, for which you don't have (or potentially own) the source code.
React is very complex itself, it was probably built using Create React App, dealing with the bundled and ejected files is probably worse, and adding the new features without the source code sounds like a nightmare for a CS grad at a startup. This might even potentially be illegal.
I've started writing a simple app using AngularJS + NodeJS to learn more about the stack, and it appears that getting markdown to work is a bit tricky and not that well supported. I'm coming from a ruby background, and I used the redcarpet markdown library, which was pretty standard and straightforward.
I've come across the angular-markdown-directive:
Pros
Simple to setup
Uses ngSanitize to clean user-submitted markdown. This library is supported by the official Angular team.
Cons
It uses showdown under the hood, which seems to have died a while back, but small progress seems to be picking up with the new maintainer. However, it has quite a few outstanding bugs, two particular bug reports dating back to 2013 and 2014 are worrying:
(1) Underscores are apparently interpreted to be italicized (will create malformed links):
https://github.com/showdownjs/showdown/issues/96
(2) Security issue that allows XSS still not patched:
https://github.com/showdownjs/showdown/issues/57
I'm not sure if (2) will be an issue in my case, since ngSanitize may help.
There is another library called markdown-it, but this library handles markdown in Nodejs instead of Angular. But their examples doesn't say much about best security practices.
--
Are there any full examples on how markdown can be securely integrated into a Node/Angular app? angular-markdown-directive seems like a good fit but has some painful problems, and most other markdown libraries are either dying/dead or they gloss over security in a production environment.
I decided to use markdown-it. It's pretty flexible; it actually allows parsing from either server or the client so it's up to you how and where you'd like to parse the markdown.
For me, I've opted to save the markdown text in the database and then parse the markdown on the client, and it works very well.
As for security, markdown-it comes with some built-in security measures, which is very nice. There is also a separate security module that you can use with it that offers additional features.
I am using the ng-if for showing the matched data from the json. Here, the current
"//ajax.googleapis.com/ajax/libs/angularjs/1.0.7/angular.min.js"
is not responding accordingly.
some where i found an example where they used another js file -
"//ajax.googleapis.com/ajax/libs/angularjs/1.2.0rc1/angular.min.js".
which when I replaced with. ng-if is working fine.
so, should I replace this file ? as they mentioned about this file is that "this is an unstable build".
what the unstable build means ? any suggestion would be highly appreciated.
The latest stable version of angular JS is 1.2.21 - I'd recommend using that. You can get the build from https://angularjs.org/.
Are you following some examples online? It's likely the examples are just outdated - Start off with 1.2.21 - The API docs for that build are here. (NG IF documentation is here)
RC -Release Candidate.
From wikipedia:
A release candidate (RC) is a beta version with potential to be a final product, which is ready to release unless significant bugs emerge. In this stage of product stabilization, all product features have been designed, coded and tested through one or more beta cycles with no known showstopper-class bug. A release is called code complete when the development team agrees that no entirely new source code will be added to this release. There could still be source code changes to fix defects, changes to documentation and data files, and peripheral code for test cases or utilities. Beta testers, if privately selected, will often be credited for using the release candidate as though it were a finished product. Beta testing is conducted in a client's or customer's location and to test the software from a user's perspective.
You can find all stable versions HERE or HERE.
It seems like ngIf comming with version 1.1.*
I am starting my project structure from scratch. I am using require.js, backbone, underscore, bootstrap, etc. I was thinking to use shim config to load non AMD compatible of backbone, underscore,etc. But, now, i think its better to use AMD (Asynchronous Module Definition) compatible version of them since it allows to load parallely the resources. But, where can i find reliable source for AMD compatible underscore, backbone and bootstrap? And can i be assured that I will alz get latest version of backbone, bootstrap and underscore AMD compatble version. Will they cause any break later?
In word, can anyone suggest me to use AMD Compatible version of them or tade off to use shim config to load non-amd version of them against loading time. I am planning to use require-jquery AMD.
I can only provide one point of view, but from my experience, at this stage, it's better just to shim the dependencies. I don't feel that amd is widely adopted enough yet to get the kind of support you'll need to make everything work nicely together using the amd versions.
In particular, I had a problem with testing (Jasmine), where my Jasmine tests would be referring to one "jQuery" and my application code would be referring to another one, because neither were globals. I just gave up and switched back to using shims, and managed to get the tests to work (although not without some work).
Not sure if it will help, but here are my personal notes on integrating RequireJS into a BackboneJS/Rails stack. The section on stubbing dependencies might be of interest if you'll be testing your client-side code. I hit quite a few snags along the way...
Yes, it is better. I can say that after developing largescale apps with require and backbone - they work great together. Use a build process that uses r.js to boil your app js down to a single file so there isn't a dependency on production obviously. We have had no problems integrating this with jasmine as a unit tester in response to the answer above (not that I would personally bother with unit testing, stick with behavioural testing instead).
This is a good starting point for getting an idea of how it fits together: http://net.tutsplus.com/tutorials/javascript-ajax/a-requirejs-backbone-and-bower-starter-template/
Though consider jam as a package manager or none at all, and grunt to create build tasks etc but still useful just don't treat stuff as gospel try it yourself!
Personally I don't think using AMD version library is better.
Because
1. rely on community to maintain the AMD version
2. use shim and export the global is better
3. you cannot expect all libraries have AMD version
I have spent hours dig bugging why the optimizely code via rjs says that Backbone is not found and had to remove some code in the backbone source to make it works.
In short, use shim.
I'm starting work on a new version of a mobile site. I am looking into using an amd script loader and have pretty much narrowed it down to require and lsjs. I know there are many pro's and con's to both, but I am trying to figure all of those out for the mobile version of my site. Does anyone have experience with this lib's at the mobile level? Just trying to get a discussion going here of what people think the best way to go is. (anyone with a 1500 rep want to create an lsjs tag :) ). Maybe either of the creators of these libraries (todd burke or richard backhouse) have an opinion on this
thanks
EDIT:
thanks to Simon Smith for the great info down below. has anyone used lsjs? it looks very promising in terms of speed, but does not have the user base, documentation, or (i think) features of require/curl, but still looks very promising
I would say use RequireJS until you're ready to go to production. Then compile your scripts and replace RequireJS with Almond. It's a bare-bones library made by James Burke (author of RequireJS) so you can rely on it to work seamlessly:
Some developers like to use the AMD API to code modular JavaScript,
but after doing an optimized build, they do not want to include a full
AMD loader like RequireJS, since they do not need all that
functionality. Some use cases, like mobile, are very sensitive to file
sizes.
By including almond in the built file, there is no need for RequireJS.
almond is around 1 kilobyte when minified with Closure Compiler and
gzipped.
https://github.com/jrburke/almond
EDIT:
Curl.js is also an option. I haven't used it but know that is a lot smaller than RequireJS. Did a bit of research as to why:
RequireJS does the following over Curl (via James Burke):
Supports multiversion/contexts, useful for mock testing, but you can get by without it
Supports loading plain JS files via require, does not have to be an AMD module
Supports special detection and work with older versions of jQuery (should not be an issue if you use jQuery 1.7.1 or later)
(At the moment) better support for simplified wrapped commonjs style: define(function(require) {});
In short, if you are only going to deal with AMD modules in your app,
do not need the multiversion/context support, and are not using the
simplified commonjs wrapping style, or using an older jQuery, then
curl can be a good choice.
https://groups.google.com/forum/?fromgroups=#!topic/requirejs/niUyLZrivgs
And the author of Curl:
RequireJS runs in more places than curl.js, including WebWorkers and
node.js. It's also got more "battle testing" than curl.js, which may
mean it has less bugs around edge cases. curl.js is also missing a few
important features, such as preloading of implicit dependencies and
support for AMD-wrapped commonjs modules. These are both coming in
version 0.6 (late next week).
On the plus side, curl.js...
is as small as 1/4 the size of RequireJS -- even when bundled with the
js! and domReady! plugins it is still less than half the size.
is faster at loading modules than RequireJS, but only meaningfully so in
IE6-8 or in development (non-build) environments.
supports pluggable
module loaders for formats other than AMD (we're working on unwrapped
CJSM/1.1 and CJSM/2.0, for instance).
supports configuration-based
dependency management via IOC containers like wire.js (via cram.js).
supports inlining of css (via cram.js) and concatenation of css (via
cram.js 0.3 by end of year)
https://github.com/cujojs/curl/issues/35#issuecomment-2954344
Back in 2014 I faced the same problem. I had some extra requirements though in order to make the site fast on mobile:
Small enough to be inlined (to avoid paying an extra request-tax to
get the loader onboard).
Inlined config file (get rid of a request).
Config file in pure javascript (no parsing overhead).
Let the browser do the actual loading (browsers are smart these days) of files.
Connect all asynchronously loaded modules together.
Support for single page apps that include legacy code that uses sprinkled $(function(){...}) constructs, yet I insist on loading jQuery late and asynchronously to speed things up.
After evaluating RequireJS, curl, lsjs and a bunch of others, I concluded that none of them came close enough to what I needed for my projects. Eventually I decided to create my own lockandload AMD-loader. I didn't open-source it at the time, because that meant writing documentation. But I recently open-sourced it with fresh docs in case it benefits others.