like bundle plugin in visual studio 2022 ( https://github.com/failwyn/BundlerMinifier )
Are there any plugins available for Rider as well?
If I have a bundleconfig.json file in my project,
Whenever I edit the source, I need a plugin that bundles and minifies the JavaScript files.
thank you.
I'm unaware of any 3rd party out-of-the-box minify plugins for Rider, but you can use File Watchers (using UglifyJs) to achieve the same goal.
Guide to setup Rider UglifyJs.
Note that you will need:
Node.js installed on your machine.
UglifyJs installed npm install --g uglify-js
Javascipt & Typescript plugin enabled in Rider.
'File Watchers' plugin enabled.
I've used this before and it works without issues. Just needs tweaking to suit your needs (such as file watch scopes, output directory, etc).
Related
So I would like to use my Macbook to build a new app but the tools I typically use for SASS, mainly the Web Compiler extension, are not supported on Mac. Is there a similar tool I can use on Mac in VS to compile Sass?
I'm using Visual Studio 2019 for Mac, Community Edition.
Looking at the Web Compiler extension it seems to use node-sass to compile the .sass files.
If you can get that working on the command line then you could do one of the following:
Run that command from the Terminal window.
Add a post or pre-build step to the project which runs that command.
Look at installing the BuildWebCompiler NuGet package which looks to be used by the Web Compiler extension to enable files to be generated on build.
Install the Task Runner Explorer extension and setup a package.json with a command that will run node-sass. Then the NPM task runner should be able to detect that and run it.
I'm trying to do some TypeScript tutorials but I'm hitting a weird problem. A while back I installed TypeScript 1.0.3.0 through Visual Studio here:
C:\Program Files (x86)\Microsoft SDKs\TypeScript
On the command line, when I check the TypeScript version it references that. I wanted to do some Angular (Angular version 2/4) so I loaded Node Package Manager and installed TypeScript through NPM. NPM loaded a newer version of TypeScript in another place on my computer. When I create Angular projects using Angular's CLI tool it somehow uses the NPM install. When I want to do simple, bare-bones TypeScript tutorials it uses the older version 1.0.3.0.
I lost my MSDN license so I can't run Visual Studio anymore. How do I update TypeScript that is in the Microsoft SDKs folder? Every Web site I check on installing or updating TypeScript tells me to use NPM.
If you don't plan to use it uninstall it, if you check Window uninstall software console panel page, you should find an item relating to that install.
If it's not there the simplest way would be to remove the old Typescript folder from your path variable (see here how to edit if you are not familiar). Look for the C:\Program Files (x86)\Microsoft SDKs\TypeScript folder and just remove it.
Then install the latest Typescript from npm.
Ok, this has happened before, I'm not sure what the deal is.
I go to install this nuget package-
Microsoft.jQuery.Unobtrusive.Ajax
the package is installed "correctly" both using the command line and the GUI. But there is no scripts added to my project?
I had the same problem with MVC6 Grid. At least there I could hack the scripts in.
I found the actual script on Microsoft's CDN page so I can work around this...just wondering if I'm missing something.
Using Visual Studio 2017 and the Project is a Core 2.0 MVC project if that helps. Thanks.
the package is installed "correctly" both using the command line and the GUI. But there is no scripts added to my project?
Since the usage of NuGet for css/javascript libraries is discouraged. You should use Bower or the npm (Node Package Manager) to add the JavaScript libraries instead of using NuGet. The newer project file formats, PackageReferences, only supports files that are in a contentFiles directory inside the NuGet package.
To use the package Microsoft.jQuery.Unobtrusive.Ajax to the .net core project, you need to select your MVC project and add a new file to the project root. While in the template manager (Add->New Item...), search for "Bower Configuration File" or "npm Configuration file".
Then edit the file and add your dependency, i.e.
package.json (npm) or bower.json:
"dependencies": {
"jquery-ajax-unobtrusive": "3.2.4"
}
Note: For package.json (npm), once you save, the file will be downloaded in a directory named "node_modules`. This alone won't be enough, as the required files need to be copied over to wwwroot folder, where they can be accessed when the application runs.
For the detailed info, see NPM, BOWER, NUGET, GULP – The Four Horsemen of ASP.NET CORE Apps.
I want to modernize my workflow of how I deal with client libraries (js, css, etc.) that I get via NPM or Bower.
I don't want to check client libraries into TFS source control.
When another developer downloads the project, their local Visual Studio and NPM/Bower will restore the libs to their workstation. And of course they would not be able to check in to TFS any client library either. Gotta keep Source Code repo clean.
When I do a local build, the local build will bundle and minify what I have locally.
When I check in my code and do a build at TFS, it would handle doing a NPM or Bower Restore there, and ALSO handle bundling and minification there.
Is that possible in the Visual Studio/TFS ecosystem?
I guess the same question can be asked of Nuget packages for server side things.
I imagine that I will have to do something with tfignore, and also somehow use a special build task (or PowerShell script) at TFS during build.
Is this overkill, or is this actually a normal, standard best practice?
Edit: versions I am using.
VS2015 Enterprise
TFS and TFS Build (on prem) 2015
In your local machine:
You need to create a NPM package.json file for your project. And when you install NPM packages, add "--save" parameter. "NPM install packageName --save".
Don't add those client libraries/packages to TFS source control. If you already added, you could delete them from TFS. Or use .tfignore file to avoid them from being checked in.
In TFS build definition:
Add a NPM build task and use this task to install those libraries when building on the build agent.In the step, you'd better specify a "Working Directory", the path is where your package.json file located. When this step runs, it will find the package.json file in the "Working Directory" and install those libraries defined in the package.json file.
I am trying to use bower inside Visual Studio 2013.
First I installed bower (not bower.js) via nuget's Package Manager Console.
Then I thought I could simply type
PM> bower init
inside the PMC to generate the bower.json.
But then it gave me this error.
bower : The term 'bower' is not recognized...
PS. The path of the PM> is pointing to C:\MyWebProject\MyWebProject\.bin.
What am I missing here??
Open the command prompt
Navigate to web project folder
Run bower init
You should have bower.json created by answering all answers on the cmd prompt.
Srinivas accurately described the steps needed to get you started with a bower.json in your root folder, which is where you want to start. You now have two main tasks:
Define dependencies - use Package Intellisense.
Install dependencies - use Grunt Launcher. They will be installed to the bower_components folder.
Reference dependencies - simply add them to you project (as links).
For more information see Introducing Gulp, Grunt, Bower, and npm support for Visual Studio.
Note that Visual Studio 2015 (currently in preview) has built-in, first-class support for all of the above: Manage Client-Side Web Development in Visual Studio 2015, Using Grunt and Bower.