I am planning to use npm to manage all my JavaScript dependencies and get rid of bower from my ASP.NET5 project. I need npm to create node_modules folder in wwwroot location rather than its default location. I tried using .npmrc but VS2015 don't recognize it. Is there a way configure this?
Related
UPDATE:
Visual Studio - File - New - Project
- ASP.NET Core Web Application (.NET Core) - Web Application
I left the default name WebApplication1
expand the wwwroot folder
expand up to wwwroot/lib/jquery-validation
in the jquery-validation folder we can see this (see img below)
- right click the WebApplication1 project in the src folder
- click on Manage Bower Packages
- Bower Package Manager screen asking to update jquery and jquery-validation (see img below)
clicked Update jquery
**everything looks normal (see img below)
clicked Update jquery-validation
dist folder has disappeared (see img below)
The text below is before I UPDATED this Q
I created an empty ASP.NET Core MVC web application in VS2015CE.
I added the bower.json file, that manages client-side stuff of the app.
Via Bower I downloaded jquery, jquery-validate, jquery-validate-unobtrusive.
Bower created a lib folder in the wwwroot folder.
Somewhere in the ~/lib/jquery-validate/ I should be able to find jquery.validate.js and it's "child" - the jquery.validate.min.js
There were no such files there, so I became suspicious and I created another project, this time a NOT empty web application.
I then compared both jquery-validate folders in the lib folders of the two applications.
My first project (created as EMPTY) has the following folder
structure:
dist folder is not present
My second project (created as WebApplication, NOT empty) has the
following folder structure:
dist folder is present and inside it there's the jquery.validate.js file and also it's child, the jquery.validate.min.js file.
What am I doing wrong? Or is it a bug in VS2015? Or a Bower bug?
You need to run the Grunt file which will build the dist folder for you. The best way I've found to do this right now is to install the Grunt Launcher extension. You can then right click on the package.json file within the jQuery-validation folder and select "NPM Install". That should build the dist folder for you.
I haven't found a way to automate this yet, but I'm sure there is. Just started using Gulp and wasn't using Grunt until I ran into the problem you're having. If someone has some tips there, that would be great. Good luck!
Right click on Bower.json file and select Open Command Line ==> PowerSell
type bower update
That's how I resolved my problem..
If Bower doesn't restore the correct packages:
delete everything from the directory value specified in .bowerrc which is located into your web project folder (e.g. wwwroot/lib)
open Git Bash (Git SCM for Windows -> when installing, choose Git Bash option)
go to your web project folder (where bower.json is located)
run the following:
bower cache clean
bower install
OR
bower update
Below it's an example of bower.json file:
{
"name": "asp.net",
"private": true,
"dependencies": {
"bootstrap": "3.3.7",
"jquery": "2.2.0",
"jquery-validation": "1.14.0",
"jquery-validation-unobtrusive": "3.2.6"
}
}
Unfortunately, none of the above offered solutions worked for me.
The problem was solved by smart people at Microsoft with a VS update or by those working on open source stuff.
Must have been a bug or something.
Anyway, thanks for the help guys..
When I create a blank Apache Cordova app, I got a directory structure like:
root
www
bower.json
...
From the project root directory, if I run "bower install ionic --save", the bower dependencies were all created in the project root while I expect them to go to www.
What is the best way use bower with VSTAC projects?
You can create a .bowerrc file at the root that has the key directory:'www/bower_components' set, indicating that the files are placed inside www instead of the root.
Visual Studio should be able to now download the dependencies inside the www folder.
Note that VS2015 also has intellisense when editing bower.json and automatically installs the dependencies too !!
Use the following command:
npm install -g "C:\Program Files (x86)\Microsoft Visual Studio 14.0\Common7\IDE\Extensions\ApacheCordovaTools\Packages\vs-tac"
It worked perfect for me.
I'm trying to get Polymer 0.9 working with Meteor however Meteor is spitting out:
While building the application:
bower_components/polymer/polymer-micro.html:9: bad formatting in HTML template
bower_components/polymer/polymer-mini.html:9: bad formatting in HTML template
bower_components/polymer/polymer.html:17: bad formatting in HTML template
=> Your application has errors. Waiting for file change.
Is there any way to resolve the issue?
You should place the components in public/ at the root of your project.
I've had the same problems. I can't tell if you're using vulcanize, but I assume so.
What fixed me was:
Install Bower: npm install -g bower (bower.org)
Create a file in the root of the project called .bowerrc
Then, you want to tell bower where to install polymer components.
In that .bowerrc put:
{
"directory": "public/bower_components"
}
Now, use bower to install polymer
bower install --save Polymer/polymer#^1.2.0
If you're using other parts of polymer like paper and iron, you'll repeat the bower install step for those as well.
Then attempt starting up meteor again.
I currently try to get myself into ASP.Net 5 development, and I'm struggling to find the "way to go" for using Bower in this.
My project structure looks more or less like this:
testProject
- wwwroot
- index.html
- bower_components (hidden by default in project.json)
- angular
- ...
- ...
- node_components (hidden by default in project.json)
- grunt
- ...
- ...
- bower.json
- Gruntfile.js
- package.json
- project.json
- Startup.cs
I can't access bower_components in index.html and as it's not included in the project by default I guess it's meant this way.
So what's the expected way to work with the bower libraries?
I've seen many people are using grunt-bower-task to install the libraries once again into wwwroot/lib (or some other folder in the wwwroot), but this seems kind of redundant to me as Visual Studio already installs the packages into the project directory.
An alternative would be to use use grunt-copy to move the files from bower_components into the target folder, but with this way you would have to list every library you want to include once again.
So has anyone already gained some experience with this handling and would share how you are doing this?
Hmmm.. Didn't sure I understand the problem right, but anyway, if the problem just in bower destination folder, just add .bowerrc file to your root with content like:
{
"directory" : "wwwroot/lib"
}
and after bower install command, bower will download libs in your dest folder
I have a dist folder inside semantic-ui zip file that I downloaded (version 1.8.1 to be precise)
Is this folder the only thing i need to deploy my Web Application as far as semantic-ui related files are concerned?
Would including semantic.js and semantic.css be enough for my web application?
I am asking this question as I want to eliminate the need of installing npm and gulp on my target machines and would just like to copy over the css and js files that are needed by the application.
Including semantic.min.js, jquery, and semantic.min.css will should be enough for the start since the semantic.min.js contains all the modules you'd need. You will find these files in 'dist' folder.