Tag: less

Node.js Express / less-middleware＆Bootstrap 3: 我最近开始学习Node.js，我试图设置一个使用less-middleware的快速安装，并且希望使用Bootstrap 3 less文件。我看了一下，但只能findBootstrap 2的教程。这是我的代码到目前为止： /** * Module dependencies. */ var express = require('express'); var routes = require('./routes'); var user = require('./routes/user'); var http = require('http'); var path = require('path'); var app = express(); // all environments app.set('port', process.env.PORT || 3000); app.set('views', path.join(__dirname, 'views')); app.set('view engine', 'jade'); app.use(express.favicon()); app.use(express.logger('dev')); app.use(express.json()); app.use(express.urlencoded()); app.use(express.methodOverride()); app.use(express.cookieParser('your secret […]

删除引导3默认样式: 对于最近的网站，客户有5种不同的品牌造型的颜色。所以为了跟踪更less的文件（我们使用节点编译为一个最终的css文件）中的所有内容，我将颜色定义为更less的variables，并使用.button-variant（）混合来生成样式。例如 @color-cta-light: #df134d; @color-cta-dark: #860c2f; @color-cta-background: #fcf7fa; .btn-cta { .button-variant(#ffffff, @color-cta-light, @color-cta-dark); } 这工作正常。不过，我也是使用面板来完成的，现在我已经结束了一个11,000行的css文件。这是很长的，因为我们需要大多数默认的Bootstrap样式（如.btn样式）以及我的自定义样式。我想知道的是（并保持它只是简单地使用button作为例子）是否有一个很好的简单的方法来删除在CSS属于默认的引导button样式，即btn成功，btn警告，等等，简单，我的意思是自动的。我们使用节点lessc模块来编译较less的文件（使用grunt watcher），所以我想象一下在编译之后需要发生什么。或者，我应该只是修改默认引导混合，什么也不做，并使用我自己的自定义混合？我觉得这样可以工作，但是这意味着每一个新版本的Bootstrap（当前3.1）都花费额外的时间来确保自定义的mixin是最新的。我希望最终是一个单一的样式表，从button.less默认button样式没有未使用的CSS额外的重载。有我的理解，这是不可能的，但我希望有一些工具，我不知道这将有助于我的情况。

如何在我的节点项目（本地）中包含较less的引导版本？: 我正在尝试学习一些关于节点的知识。我已经成功地build立了一个节点的静态web服务器，我想要引导去。我只想用我的节点项目。我想我应该这样做，但不知道有没有更好的办法？ 1）下载所有.less引导文件并将其安装到我的/ css文件夹中2）使用grunt编译我所有的.css文件，然后链接到css文件。我有两个问题 1）这个过程会工作吗？ 2）有没有更好的工作方式，如果这不起作用？

节点全局模块和require（）中的include是否有区别？: 我一直在尝试在节点中运行一个小的js脚本。它有一个声明var less = require('less'); 。我确信node ， npm和less是全局可用的。尽pipe，当我在我的lessCompile.js上运行node时，我得到一个'module not found'错误。为什么？这是我的命令行序列。 C:\Program Files (x86)\Apache Software Foundation\Apache2.2\htdocs\node_tut>npm install -g less C:\Users\stumma\AppData\Roaming\npm\lessc -> C:\Users\stumma\AppData\Roaming\npm\node_modules\less\bin\lessc less@2.0.0 C:\Users\stumma\AppData\Roaming\npm\node_modules\less ├── graceful-fs@3.0.4 ├── mime@1.2.11 ├── promise@6.0.1 (asap@1.0.0) ├── mkdirp@0.5.0 (minimist@0.0.8) ├── source-map@0.1.40 (amdefine@0.1.0) └── request@2.47.0 (caseless@0.6.0, aws-sign2@0.5.0, forever-agent@0.5.2, json-stringify-safe@5.0.0, oauth-sign@0.4.0, stringstream@0.0.4, tunnel-agent@0.4 .0, node-uuid@1.4.1, mime-types@1.0.2, qs@2.3.3, combined-stream@0.0.7, tough-cookie@0.12.1, […]

正确的Autoprefix插件为我的less中间件节点expressjs: 目前我使用较less的中间件（ https://www.npmjs.com/package/less-middleware ）。我不满意这个解决scheme，因为less-middlware创build一个编译的css文件。我想要一个记忆的解决scheme，我可以通过expressjs路由。此外，我想与一个适当的autoprefix解决scheme，因为有许多很好的CSS技术，我不能使用，因为我需要很多时间来添加供应商的前缀。有没有人知道一个更好的解决scheme，即时编译而不输出一个单独的CSS文件。这个解决scheme可以提供某种自动修复function吗？提供较less的中间件是否提供自动修复function？我还没有find那个方向。

无法在mac上使用NPM安装lessc: 我试图在我的Mac上全局安装lessc，我从他们的网站上安装了node.js，当我运行这个命令（npm install -g less）时，我可以帮到我，我想要做的就是安装less并在sublimetext上获得less2css编译器3正常工作： npm install -g less npm WARN locking Error: EACCES, open '/Users/Mohammad/.npm/_locks/less-c2213c903e2e7354.lock' npm WARN locking at Error (native) npm WARN locking /Users/Mohammad/.npm/_locks/less-c2213c903e2e7354.lock failed { [Error: EACCES, open '/Users/Mohammad/.npm/_locks/less-c2213c903e2e7354.lock'] npm WARN locking errno: -13, npm WARN locking code: 'EACCES', npm WARN locking path: '/Users/Mohammad/.npm/_locks/less-c2213c903e2e7354.lock' } npm ERR! Darwin 14.4.0 npm ERR! argv "node" […]

如何使用webpack从npm依赖关系编译.less文件？: 我正在使用npm模块elemental ，它包含一个/less文件夹以及所有相关样式的反应UI。我目前正在试图用less-loader来做到这一点： /tasks/config/webpack.js ： 'use strict'; let path = require('path'); let ExtractTextPlugin = require('extract-text-webpack-plugin'); module.exports = function(grunt) { grunt.config.set('webpack', { client: { entry: { app: `${process.cwd()}/src/app.jsx`, }, output: { filename: '[name].js', chunkFilename: '[id].js', path: `${process.cwd()}/dist`, }, module: { loaders: [ { test: /\.jsx?$/, exclude: /(node_modules|bower_components|dist)/, loader: 'babel', query: { presets: ['react', 'es2015'], }, }, […]

npm安装较less从ruby抛出错误: 我试图使用更less，遵循他们的入门指南我成功运行sudo npm install -g less ，结果是： /usr/bin/lessc -> /usr/lib/node_modules/less/bin/lessc less@1.7.0 /usr/lib/node_modules/less ├── mime@1.2.11 ├── mkdirp@0.3.5 ├── source-map@0.1.33 (amdefine@0.1.0) 但是当我尝试使用lessc我从Ruby中得到一个错误： $ lessc /home/jasonshark/.rvm/rubies/ruby-2.0.0-p247/lib/ruby/site_ruby/2.0.0/rubygems/dependency.rb:298:in `to_specs': Could not find 'less' (>= 0) among 153 total gem(s) (Gem::LoadError) from /home/jasonshark/.rvm/rubies/ruby-2.0.0-p247/lib/ruby/site_ruby/2.0.0/rubygems/dependency.rb:309:in `to_spec' from /home/jasonshark/.rvm/rubies/ruby-2.0.0-p247/lib/ruby/site_ruby/2.0.0/rubygems/core_ext/kernel_gem.rb:47:in `gem' from /home/jasonshark/.rvm/gems/ruby-2.0.0-p247/bin/lessc:22:in `<main>' from /home/jasonshark/.rvm/gems/ruby-2.0.0-p247/bin/ruby_executable_hooks:15:in `eval' from /home/jasonshark/.rvm/gems/ruby-2.0.0-p247/bin/ruby_executable_hooks:15:in `<main>' 这是什么冲突，我该如何解决？我的$PATHvariables是： $ echo $PATH […]

Bootstrap LESS – Grunt手表输出到特定的目录: 当谈到命令行，批处理和东西我总是noob。老实说。我正在使用Windows 7 64位和Bootstrap 。我想用LESS试试Bootstrap，原因有二：更好地pipe理Bootstrap的CSS和颜色variables 要学习LESS，以便稍后可以使用它。所以我按照说明去安装node.js和Grunt。只要我使用> grunt dist命令，每一个都变得顺利和干净。没有错误，CSS准备好了。但是，每次运行命令和移动文件（我把.less项目与我的php框架分开）是有点无聊的，所以我看着> grunt watch 。它工作正常，但我仍然需要移动我的文件。问题来了：有没有办法改变这个命令，让Grunt将bootstrap文件保存在别的地方？我使用的Gruntfile.js是我用bootstrap获得的一个香草。