How can I use Twitter Bootstrap, MVC and Visual Studio together?

I am starting to try out Bootstrap. I've already downloaded countless extension but I'm confused as to what to do next. Looking at the boot files I see a lot of idle files. Can someone please explain where I should put them in the MVC folder structure and how I can configure the application so that my .css files change when the color variable changes.


As I said, I put all dormant files in the same directory as my css.

However, what should I do next? I tried to view the url


in my browser but got the following message:


Expected '}' but found '~' on line 522 in file 'mixins.less':
[521]:     .spanX (@index) when (@index > 0) {
[522]:       (~".span@{index}") { .span(@index); }
[523]:       .spanX(@index - 1);



source to share

4 answers

I am currently compiling fewer files on assembly with nodejs.

You need to install node.js .

Once installed, on the command line, type: "npm install less -g" this installs the latter less globally (-g at the end for globals).

In visual studio, navigate to the Build Events section of the websites property page and enter "build events command line" as follows:

lessc $ (SolutionDir) path-to-main-less-file.less> $ (SolutionDir) path-to-where-css-is-output.css -x

EDIT: Bootstrap is now using the Recess command and the npm command changed as shown here .

Take a walk with me, this is my first post! :)



This is a known issue in Dotless:

Most of the Bootstrap source code uses LESS features that are not yet supported in the Dotless version you are using. Obviously support was added to the latest source, so you should be able to solve this by compiling Dotless from the latest source.

It is not enough to download and link to dotless.Core.dll because the binaries are not up to date enough i.e. do not contain the latest features you need for Bootstrap. Only the source files contain the latest changes, so you need to create dotless.Core.dll by compiling the latest source with Visual Studio. Of course, these features will be included in the .dll download when they follow the update.

Dotless creates the bootstrap.css result file on the fly. You never see this file on disk as it is generated by compiling dormant files when requested over HTTP. The generated CSS is only cached in memory. However, you can always request the .less file in your browser and save what you see in the .css file. This will work, but it doesn't make sense if your Dotless setup is working correctly.

However, if all you need is a bootstrap.css file with your customized values, you can also use this online tool on the Bootstrap website.This will allow you to change the variable values ​​and load the resulting CSS.



Have you tried Mindscap Web Workbench ?

They have an article on how to set it up for use with Twitter Bootstrap .



You can use Combres for my free plugin here . All you have to do is link bootstrap.less and all imports will work out of the box with pure Bootstrap fewer files. Combres will create and cache the bootstrap file and even compress it with other cssssstrapstrap files. This is the perfect setting.



All Articles