With the new Material Design released by Google and Polymer being one of the best, if not only, libraries to create such a design with ease, is there anyone to develop a Chrome Packaged App using the library to get the Material Design look it provides? Currently, it gets scripted block by Google's very strict CSP
Check out Vulcanize: http://www.polymer-project.org/articles/concatenating-web-components.html
It's a build tool for crushing HTML imports into a single file. It also has a --csp option that moves <script> into its own file. This will make CSP happy.
We're working on a template for Polymer Chrome App in the Chrome Dev Editor:
https://github.com/dart-lang/chromedeveditor
I'll update this thread once the template is available. This should make Polymer dev in a Chrome app a lot easier.
Here is another option.
If you're big fan of Dart language, you can use https://github.com/sunglim/csp_fixer package.
This package has a function to strip <script/> and create external js file.
Investigating ebidel response about vulcanize, I found that polybuild could be even more easy if you dont want so many extra options.
https://www.polymer-project.org/1.0/docs/tools/advanced#build
Also found this project on github that uses vulvanize with --csp option.
https://github.com/PolymerLabs/polymerchromeapp
Related
I am giving a presentation in which I need to have my code editor open alongside my HTML slides. Since I have the VS Code editor configured the way I need, it would be nice to have a way to display the HTML slides in the VS Code editor itself.
I strongly suspect this is possible, because VS Code is a very powerful editor with several extensions and features. I have tried installing an HTML previewer from the marketplace, but that could not load all the dynamic content of the slides. I also tried the VS Code reveal extension, but that did not work for me either.
Is there an alternative way to do this? Any help will be highly appreciated.
Live Server VS Code add-on launch a local development server with live reload feature for static & dynamic pages; the reveal presentation is automatically rendered each time the edited code is saved on the VS Code side (Control+S).
There is an unreleased version yet that does not require saving to see the changes...truly live.
It is a workflow that makes it much easier to check changes before publishing them. Combined with the possibility of editing the html front-end of the presentation generated by Live Server, with the browser's Dev Tools, a very dynamic environment is created.
I'm trying out Chrome Devtools persistence/Workspaces. It works great for a very simple project with no build tools. I can edit the CSS in the inspector and the changes show up live, I can edit HTML and JS in the sources panel once I right click add a workspace, then add a mapping to the remote files.
It's very lightly documented and doesn't seem well used though, I'm wondering if it's possible to use this feature and have code that's been run through a preprocessor and have my updates apply to the source file. Obviously I'd have to set up source maps, but it doesn't seem from what I've found so far that you can do that along with the persistence feature.
I'm new to elipse php. i have used dream viewer for my php development before moving to the eclipse. So, i need to know when i drag and drop the css file into html editor, it needs to auto genarate the <link> tag for that css file. It worked with dream viewer. But its not working with eclipse. And, also when i need to use css classes inside html tag it needs to type the css class name.But, instead that i need to know how to config that to all the css class as suggestion for html tags, like in dream viewer and netBeans.
The text DnD (Drag and Drop) feature (initially introduced by bug 11624 in 2007) has been slowly extended to various editors, as reported by the bug 231294:
Tested in EclipsePdt-2.2.0.v20100427
Verified fixed for:
PHP files
JS files
Still reproducible in:
CSS files
HTML files
XML files (source view)
So it is still "work in progress".
The relevant blocking issues are:
bug 178104: [DND] Need to revisit dnd API to allow multiple drop targets
bug 173405: Make use of IDragAndDropService (Show Votes)
bug 195655: Drag'n'drop selected text
First of all Eclipse is not an IDE, it's a platform you can build IDEs (or any other application). There are several implementations for different languages. Most popular one which is actually the origin of Eclipse is Java IDE. There is also a plugin/feature for PHP development, called PDT.
DreamViewer is a specialized WYSIWYG editor for web development (mostly around HTML/CSS/Javascript) that includes support for different web scripting languages. It has some special properties as you mentioned, that can create a link element when you DnD.
What you can do is request a new feature from PDT team, that creates a link element to the dropped file inside a HTML document.
I want to know if its possible to customize the way your default google chrome look locally on your computer. I am talking from a developer's point of view and not user(ie not to change the home page by going into chrome setting).
I can change the UI by using the chrome f12 option locally. As chrome is installed on my machine then there should be an index.html or something alike file present to render chrome as it does. I want to access that file if possible.
Thanks
you might be able to find some various files, so i would suggest looking through the following folder. C:\Users\MYUSERNAMEHERE\AppData\Local\Google\Chrome\User Data\Default
or C:\Users\MYUSERNAMEHERE\AppData\Local\Google\Chrome\User Data\ as these are the ones that contain your chrome installation, there maybe another folder but this is always the one i have used when developing extensions..
Otherwise i think you will be stuck with the extension part, i myself would have a look at this if you really need.. But that could be a week before i get the chance.
If your looking to deploy a custom google chrome, so they dont need to install extensions. Try the following google term: deploy custom chrome
https://developer.chrome.com/extensions/external_extensions
But editing it directly with just finding a single html file / style i dont think is as easy as it would need to load certain objects into memory and i think they are a little more complex than a plain text file.
EDIT - Looks Like Its Extension Only Now
Had 5 minutes and did a quick google, there was a point where you could use custom style sheets for v32 and below but that was removed https://src.chromium.org/viewvc/chrome?revision=234007&view=revision
So you either need to work with firefox or build an extension.. I could not see any files/folders that would do what you need. So yea i'd start looking at extensions.
My website files are stored in c waamp www folder and i use devtools autosave to update my css file. But its not working while working on localhost. What do i need to do to make it work with localhost?
I suppose this will help you out
since Google Dev Tools version 28 you will not need the extension "Autosave" anymore.
It has been substituted by Google Web Tools Workspace.
If you want to understand how to use Google workspace, you can ckeck-out this link:
Live edit CSS and JS with Google dev tool
The only big limitation is that with google dev tools you can't edit DOM elements directly in the "elements" panel, neither the inline style definition.
However I found a better way for doing it;
There is an extension for Google Chrome that combined with an Intellij Idea plugin makes you live editing HTML, CSS, JS and it work amazingly.
It is probably better than using Google Dev Tool. The only disadvantage is that you cannot inspect the elements you are editing in the browser itself but you can obviously do it in your IDE which is even better.
I documented the process here if you want to take a look:
Live edit CSS-HTML-JS with Intellij Idea
Luca