MVC4 + AngularJS - prevent minification of properties - asp.net-mvc-4

I've read this post Mvc4 bundling, minification and AngularJS services
But it doesn't adress how to correctly minify AngularJS projects.
Should I minify everything except my viewmodels ?
Lets say my templates use code like this:
Hello <b>{{model.name}}</b>
if I minify the controller, the "model" property will be minified, right?
Thus breaking the above template.
I saw some video about AngularJS where they stated that you can apply minification but skip minification for properties.
That should solve the problem, minify the code but keep all property names on controller/models
How would I accomplish this with MVC4 bundles?

I believe you can minify everything. You model will be always be instantiated over $scope such as $scope.myModel and hence the model names would not get minified.
What little bit i know about minification, a minifier does not minify elements that it cannot ascertain about their usage scope. So minifier minifies private vars, functions etc.
We are using AngularJS with bundler in our MVC project and we have not face issues with AngularJS as such.

Related

Using Vue SFC into existing Web pages with CDN vue

I would like to ask what is the best approach to include and reuse Vue components that are written in .vue files (SFC), into existing web pages.
For example lets say there is already an SPA project and also an ASP Core project. I would like to reuse my ~/SPA Dir/components/*.vue into my Razor pages or just plain HTML pages. To be more specific the web pages are using Vue through the CDN js file.
In most Vue tutorials it is often mentioned how Vue is used to create SPAs or it can be used in already existing web pages. And there is also emphasis on the reusability of its' components. But it seems very frustrating and complex to follow those guidelines with often lacking and unclear guides.
From my research I realize that there must be an intermediate build process that will produce js files form the vue files. And also the need of tools like vue-loader and webpack. But still I could not find something straight to the point.
Is there a more straightforward approach or what is the most common approach to the above-mentioned scenario.
(Vue version: 3)
Thank you
Maybe try this SFC loader: https://github.com/FranckFreiburger/vue3-sfc-loader
I use it on my PHP server, where I have my .vue components and I need to compile them as .js.

The better way to build a VueJs Website (Framework easily deployable)

Hey i search a powerful web framework with some specific features :
VueJS support (single file / template)
ServerSideRendering
Easy deployment (with Now, Netlify, etc..)
Powerful dynamic routes management
Why not Nuxt.Js
Because Nuxt does not support dynamic routes when the app is generated (it does not define routes automatically)
Use vue-cli-3 and generate a project with all the bells and whistles (vuex, vue-router, typescript, SPA, unit testing, etc). Then add Vuetify or another similiar Material Design framework to spruce up the UI.
Of course this is opinion based and your question will most likely get pulled down soon :)

Integrating Polymer application with ExpressJS application

I use ExpressJS to build an application and after trying different frontend frameworks (vue and angular) I settled on google Polymer. I integrated the polymer app by including all the Polymer files in the Expressjs public folder (every file including package.json) and it works fine with my api routes.
Now my question is regarding this approach:
1-Is it safe to include it in the expressjs public folder? It's just html, css and js files.
2-If there is a better setup. What would be a better setup?
I hope someone out there with good experience and enough knowledge could share some practical advice with me. Please be a little specific and if you can share an application folder structure so I can understand it visually.
Yes, it should be safe, because Polymer is a client-side Framework, which means that all of its files have to be public anyway, but usually you serve the build-version of your project (Run "polymer build" with the options you need), which doesn't contain all the config-files (like package.json).

How can Durandal bundle views?

When deploying an enterprise Durandal application with hundreds of views, is there a way to bundle the html templates so that little http requests for every view can be avoided in favor of a single, compiled html view?
With Durandal, you're developing a single-page application, so there's only one, up-front request made for views. Caching and other optimizations, including optimization with Weyland, Durandal's build system, can tweak that further.
There are circumstances where you may wish to load views in a different way, and those can be achieved with Durandal as well.
After you built your app with, for example, Grunt (http://durandaljs.com/documentation/Grunt.html) you are getting one big file 'main-built.js' with all your javascripts buldled together. The thing that I didn't realise at first, was that all the .html views are also bundled into this file. I was expecting to see them bundled into 'index.html' or something like that (compiled html view). But actually views are compiled into Javascript.

Combine ASP.NET MVC4 bundling and require.js javascript module dependency

Is there a way to use the bundle functionality of ASP.NET MVC4 and the JavaScript module dependency feature of require.js
I want to load all my modules with ASP.NET MVC4 bundle features and use require.js to organize the relationships between them.
The problem is that require.js doesn't find the needed dependencies while all the modules are loaded via bundles.
I don't want require.js to go and try to load files asynchronous I just want it to use already loaded modules via bundles.
What should the main file look like in this case.
I Have the following structure in _Layout.chtml
#Scripts.Render("~/bundles/jquery",
"~/bundles/jqueryval",
"~/bundles/jslibs",
"~/Scripts/require.js",
"~/bundles/tjProductivity",
"~/Scripts/tjpApp/main.js"
)
#RenderSection("scripts", required: false)
And then in each scripts section I want to load all modules that will be used for that page via Bundle.config but let require.js manage dependencies between them.
It's possible, use almond.js, from the creator of RequireJS.
The only shortcoming is that you have to always add the module names on your modules...
A good reference on integrating requirejs and mvc:
http://www.codeproject.com/Articles/614507/Modular-Javascript-Using-Require-Js
and
http://www.stefanprodan.eu/2012/09/intro-requirejs-for-asp-net-mvc/
- note that it doesn't using bundling.
This article shows you how to integrate RequireJS in a ASP.NET MVC 4
project and structure the JavaScript code in such a manner that any C#
programmer can understand and use it without advanced js programming
skills.