is it possible to minify css and js files inside a specific folder and then use the minified files for a file, let's say the index.html.? Im thinking of using the pom.xml then use the maven-minify-plugin and the replacer plugin but I can't find a good structure.
you should use the static-helper-maven-plugin from WUIC project (http://wuic.github.io/)
The maven plugin relies on WUIC to parse the index.html of your workspace, collects js/css used inside it, resolve them, minify them, aggregate them and rewrite the index.html with a version number in URLs to burst client cache in case of any change.
wiki: https://github.com/wuic/wuic/wiki/Process-at-build-time
The WUIC's website is generated optimized with this approach:
- source: https://github.com/wuic/wuic.github.io
- result: https://github.com/wuic/wuic.github.io/tree/master
Related
I'd like to use the dist package from swagger-ui to be able to expose my webservice. The dist pkg is located here: https://github.com/swagger-api/swagger-ui/tree/master/dist
While I can use this: Swagger UI with Tynamo Resteasy for Tapestry 5.4
to create the swagger.json, I'd like to use swagger-ui to expose this json.
Can anyone point me on how to use this dist folder as is in Tapestry (pref. 5.4)?
Note: I tried using the index.html as a tml (by loading all #Imports it needs in the .java page corresponding to the tml, but that did not work, as a lot of assets referenced inside the dist folder give me 404...Also, seems like there should be an easier way to do this?)
To my Grails project, I use ztree library.
In the css of this library, we have the following :
background-image:url("/ztree/img/zTreeStandard.png")
I have 3 directory in assets/
images/
javascripts/
stylesheets/
I don't want to modify the css to change the path of background-image:url("/ztree/img/zTreeStandard.png").
So, here are my questions :
Is that mandatory to create a ztree directory in assets/ ?
Can I put ztree directory in images/ ?
Thanks,
If you store the image at grails-app/assets/images/ztree/img/zTreeStandard.png, the assets-pipeline plugin should be able to resolve it (I haven't tested this). If it doesn't work, the reason will be because of the leading / in the path
background-image:url("/ztree/img/zTreeStandard.png")
I understand that you don't like modifying 3rd party code, but I don't think you'll have any choice other than to change this to
background-image:url("ztree/img/zTreeStandard.png")
I would recommend creating a assets/vendor directory and you can just dump all your third-party libraries in there. It should be smart enough for you not have to change any paths--though the absolute URLs might mess things up since usually grails is running at http://host:port/app-name/.
I have an AngularJS project that I am thinking of migrating to Dart. I do not want to migrate the whole project in a big-bang, so I am looking for ways to run the two apps side-by-side.
The dart app will run on the root as index.html. The js app will run on a separate path, say '/jsApp'.
When I build a test project, it seems that the /build directory includes a lot of unnecessary files. Would I need to deploy the complete contents of the /build/web directory?
What is it that actually gets loaded? Do html files still get loaded at runtime or are they bundled into the main file?
Do I need main.dart.js as well as main.dart.precompiled.js? It seems that they are very large files for a trivial app. Is that to be expected?
It is still unclear to me how all these things hang together.
If you want to keep the generated files as small as possible, you should:
Make sure your pubspec.yaml includes the angular transformer, as explained here: Angulardart. Creating your first app
Your pubspec.yaml should look like this:
name: angular_dart_demo
version: 0.0.1
dependencies:
angular: 0.12.0
[...]
transformers:
- angular
html_files:
- web/my_html_template.html
- web/another_html_template.html
Build from the command line with pub build
This way you will get 800KB js, instead of 5MB js ;)
That's because Angular Dart uses mirrors and, as a result, the generated js code can get very big if you don't use the angular transformer.
I think html templates are copied to the build directory and will be requested at runtime.
You will have to merge the contents you get from "pub build" with your existing js application somehow.
I am using AngularJS with Dart controllers mixed in. You do not have to adapt your current project structure to use the pub build. Just use dart2js to compile the individual dart files and include the ".js" files in your page. You do not have to add the native dart script tag or include the dart bootstrap in your code. Just include a script tag for the generated js file (the only file you need) and it will do what you expect. I plan to write up a brief overview of this soon.
Normally the entire build directory needs to be deployed and there are normally no unnecessary files.
The *.precompiled.js files are not generated anymore in recent Dart builds (this was for CSP compliance).
What Dart version are you using?
If you build in debug mode also the source map files are generated in the build directory.
The browser loads the HTML file the user requests and then loads the script files references in <script> tags in this HTML and all other resources (img, css, ...)
I don't know if the build output of an Angular component with an external HTML-template file is inlined in the index.html or if they are copied as they are.
Simple question, could'nt find a straight answer. How can I modify the output file name of a T4 Template?
I'm using a T4 Template to bundle and minify all my javascript files. Now I want to include the current Assembly Hashcodein my filename. But how can I access this filename?
A workaround would be to rename the ouput file after generating it but this doesnt't seem nice to me.
You need to do something called auto-versioning, and this is usually done by URL rewriting. The physical files are not actually renamed.
See this question for details on javascript and css auto versioning:
How to force browser to reload cached CSS/JS files?
Note that if you use templates to generate a different physical file for every time you generate a file then you will lose a lot of benefits of source control (revisions etc), and you will end up with an unmanageably large set of files on disk.
I am using Symfony 1.31 for a brand new project. I have just created a module in the backend app, using the admin generator. To my suprise, it seems no theme ((At all) has been applied to the pages. As I mentioned before, this si abrand new project - I have not even modified the /app/backend/layout.php file yet.
I rember having a similar problem before - I dont remmber how I solved it (I think I had to run a task or copy some files over to the /web folder before the styles/images etc came into efect. Can anyone refresh my memory?
You might need to run the plugin:publish-assets command:
php symfony plugin:publish-assets
This will create symlinks to your plugins' web/ directory inside your project's web/, thus enabling access to sfDoctrinePlugin's (or propel depending what ORM you use) admin-gen styles.
Check your apache configuration and files permissions, and especially the alias to the /sf/ subdirectory. It seems that the .css file corresponding to sf_admin pages are not accessible. You can fix it by adding an Alias to your virtualhost configuration, or allowing symlinks.
(By the way, hint: check your html source, find out the .css url, and try to access it directly with your browser)