I installed Visual Studio 2015 this week. However I discovered that I have no intellisense in my Razor Views.
In Visual studio 2013 it worked fine.
My all my css files are under ~/Content/css/ (*.min.css), including bootstrap.
Here is the bundle config:
bundles.Add(new StyleBundle("~/Content/smartadmin").IncludeDirectory("~/Content/css", "*.min.css"));
When I try to use some bootstrap css in my razor view, nothing pops up in the autocomplete box. There should be a purple icon next to the bootstrap classes right..? There are no icons and no css classes listed which is available under the bootstrap package.
I did a sanity check and created a new MVC 5 application. This comes shipped with bootstrap. This works, all the intellisense is there.
How do i fix this issue? Surely it must be a problem with my Solution? Does it not like the css files to be under a sub folder under content?
UPDATE: So i copied in the unminified versions of the files, then it got picked up. So anyone know the reason why VS does not pick up minified files for intellisense?
It seems like the solution is to add non-minified Files to your solution in order for intellisense to work. I think it is due to Microsoft splitting out the minifier into a separate extension.
If your project type is an ASP.NET web application and you are using a 'Master page', the easy fix is to add a link to the css file in the master page. For example, in the master page 'head' section I add:
<link rel="stylesheet" href="Content/bootstrap.css" type="text/css" />
ASPX and other WebForm files using the legacy editor do not benefit from this implementation in VS 2013, but may adopt the new system in future releases.
But you can still use this feature as follows:
right click on the default.aspx file in the Solution Explorer
open with
select HTML Editor
ok
If someone comes here and the accepted solution doesn’t work.
In my case I had to remove the database project (.sqlproj) from the solution for the Bootstrap css class intellisense to work.
Remove the database project then restart Visual Studio.
And to be clear. This is not a good solution as removing the database project is not what you want. So, hope someone finds a good solution to this weird bug.
In my case, the intellisense not worrk because the path of bootstrap files was changed then files are not included in the project.
After adding files to the project works fine.
I know... It is a simple solution. Sorry!
I got it worked by ensuring all actual scripts are in place and in order.
<script src="Scripts/jquery-3.2.1.js"></script>
<script src="Scripts/bootstrap.js"></script>
<script src="Scripts/angular.js"></script>
<link href="Content/bootstrap-theme.css" rel="stylesheet" />
<link href="Content/bootstrap.css" rel="stylesheet" />
After that I closed the visual studio solution and reopened it.Intelli-sense started working for bootstrap afterwards.
What worked for me: Link to the full bootstrap css, close the view(s), rebuild the solution, open the view. Intellisense worked. Change to the minified css, close the view, rebuild, open the view. Intellisense still working.
Related
I'm just learning ASP.NET and I created the default Web App template in Visual Studio. There are some bootstrap.css files under wwwroot folder but even if I comment everything out it doesn't have any effect on how the website looks like.
For example in _Layout.cshtml the #RenderBody method is wrapped up in div class="container" but editing ".container" in the CSS files doesn't do anything. It's only when I delete the class name "container" in the div element something actually happens. So why editing these CSS files don't have any effect?
The browser is likely caching bootstrap.css because it is linked into the page. Try opening dev tools in your browser and telling it to dump the cache and hard reload (if you are using chrome/edge, for example).
Some devs get around this by only opening their site in private mode or with debug/dev flags. FireFox even makes a developer edition of their browser too.
I think running your site using "dotnet watch" might also fix the issue.
Check your layout, what .css file you used. You can see it in the layout or using F12 to see it in the network.
Below is two options:
1.If you used the bootstrap.min.css in your layout
<link rel="stylesheet" href="~/lib/bootstrap/dist/css/bootstrap.min.css" />
You need comment .container in your bootstrap.min.css
2.If you used bootstrap.css in your layout
<link rel="stylesheet" href="~/lib/bootstrap/dist/css/bootstrap.css" />
You need comment .container in your bootstrap.css
The structure is like below:
How do I disable Angular CLI from bundling js/css when running the Angular template project in visual studio 2017?
I notice that after running my solution, the following element is added right before the end of the head
<link href="styles.bundle.css" rel="stylesheet"/>
And this element right before the end of the body.
<script type="text/javascript" src="inline.bundle.js"></script><script type="text/javascript" src="polyfills.bundle.js"></script><script type="text/javascript" src="vendor.bundle.js"></script><script type="text/javascript" src="main.bundle.js"></script>
I dont want to bundle anything, and instead want to use whatever CSS/JS is referenced in the actual html files. No optimization needed at this point in time.
Im using Visual Studio 2017 pro, v 15.8.0
and the Angular template that is created when creating a new project as shown below.
Is this the angular CLI that is doing this??
UPDATE: Solved half the problem in answer below, still looking for the JS fix.
Solving half the problem here. In order to disable CSS bundling, all that is required is to ensure that .angular-cli.json styles node is empty as shown below
So that solves the CSS problem, 50% of the problem really.
I've just downloaded IntelliJ IDEA 15 and am having issues with CSS class autocomplete from linked stylesheets. An example is when I link Bootstrap's stylesheet in the header as shown below:
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css">
The CSS classes don't autocomplete. The only way I've been able to achieve this is by actually attaching the stylesheet within my project. On the contrary, my JavaScript linked assets show correctly and can also be referenced within the project. I have downloaded most all of the necessary plugins including LiveEdit, Emmet, CSS-x-fire, and all other necessary tools.
If anyone can help me with this, it would be greatly appreciated. This software seems to be very robust and I'd like to continue using the IntelliJ product suite.
Consider to remove Web facet from your project module. (Open the project structure dialog) It helped me in similar situation.
I use Spring and have found this answer to similar question, however it not at all satisfactory since it requires changing project structure:
Get Eclipse to recognise CSS included via context in Spring MVC project
So the question is, can I somehow set Eclipse to ignore "Undefined CSS class" warning.
It's not just about Spring, I might have some CSS classes I use in JavaScript that are not present in CSS spreadsheet or any other reason. The warning is shown on every element on html that uses css class that it cannot find, say:
<div class="js-something">Something</div>
This class is not going to be defined in .css file since it is only used in JavaScript. Same thing with Spring where .css is connected with:
<link href="<c:url value='/css/style.css'/>" rel="stylesheet" type="text/css" />
Or in AngularJS project where html files are added with ng-include. This warning is really barely helpful, it probably should be even disabled by default. I've looked all through Eclipse settings but couldn't find any way to ignore this kind of warnings. Can anybody help me get rid of those?
Allright, I've found it. Funnily enough, it is under "Validation" if you edit project preferences, but not in overall preferences, that's why I couldn't find it when searching preferences by "Validation".
In project preferences: Web Resources -> Validation -> CSS
In overall preferences: Web -> HTML Files -> Web Resources -> CSS
Finally my projects are no longer riddled with yellow markers.
Whenever I am working in Visual Studio I always found that it will not resolve the css class names in my html. The CSS Class names will appear with the green squiggly line in Visual Studio but then the page will render fine when viewing it in the browser. So I know the css file is referenced correctly in my master page but Visual Studio is just failing to resolve it. Also the Design View will not show any of the css styles either.
See this post by Jeff King about getting Visual Studio to be able to find the javascript file with the intellisense: JScript IntelliSense FAQ.
In particular read point #4, third bullet:
Site-Relative Paths - These are paths
of the form "/folder/file", and is
calculated from the base of your site
(http://site/application/folder/file).
This approach is supported by ASP.NET
Web Forms and ASP.NET MVC. However,
it is not supported by Visual Studio.
The reason is because Visual Studio
does not always know the final
deployed location of your site and
thus the path resolution cannot be
guaranteed. Given that quite we've
seen few folks are using site-relative
paths, we could consider making an
assumption just resolving this type of
path to the root of the project.
Given the risk that you may think your
site is working when it's really not,
I wanted to see how many people were
supportive of this.
Notice the “[Site-Relative Paths are] NOT supported by Visual Studio”. I always use site relative paths for my javascript and css files so the solution to get Visual Studio to find your javascript files is the same solution to get Visual Studio to find your css files:
<link href="/content/default.css" rel="stylesheet" type="text/css" />
<% if (false) {%>
<link href="../../content/default.css" rel="stylesheet" type="text/css" />
<% } %>
And now Visual Studio can find the CSS file and validate my CSS Class names exist (and Design View looks so much better too).
Posted on my blog here:
Why does Visual Studio not resolve my CSS class names?
-Jeff
I just saw an answer to this, so I thought I'd share it.
You can get VS2008 to recognize your CSS file by going to the View/Manage Styles toolbar and adding your CSS file that way. When I did it I saw my CSS file in the Manage Styles list but it had a warning icon because VS couldn't see it for some reason. I deleted and re-added it, and now VS is finding my styles (no green error squiggle) and Intellisense is working. Much relieved!
Tried to just close the project and open it again? It might be that it's just a bit slow, or you're using some sort of path to the stylesheet (generated on basis of other data or whatever) that can't be read directly by VS.
Never experienced the same (VS08).