使用nodeJs来安装less及编译less文件为css文件的方法

NodeJs

使用nodejs安装less以及编译less文件为css文件

首先下载nodeJs的安装包，按照步骤，安装nodejs.

链接：http://pan.baidu.com/s/1dEsqYB3 密码：bkkh  这个链接里面有nodejs的安装包，大家可以直接下载下来，安装就可以了。

然后cmd打开控制台，检查node是否安装成功。输入node –v,如果输出的是安装包的版本号，则表示安装成功。

接下来就可以安装less了，进入node.js安装目录，通过命令npm install less –g 全局进行安装less.

使用lessc命令对*.less文件进行编译了

格式：lessc [目标less文件目录] [生成css文件目录]

lessc example/example.less example/example.css

我是直接把文件夹放到了nodejs安装目录下面了，安装好了以后，编译器会自行生成一个example.css的文件夹

如果要编译d盘下的文件，比如d:/wamp/wamp/www/css3/style.less文件，可以直接这样编译

然后就编译成功啦！

ps：下面给大家分享通过nodejs将less文件转为css文件

已经安装过nodejs

1，安装less；

dos界面下进入node.js安装目录，通过命令npm install less –g 全局进行安装less.（安装过程可能需要等待一段时间）

2、先在控制台编译一遍：lessc 文件路径\文件名.less（可省略）；

3、在dos界面输入：文件路径\文件名.less > 文件路径\文件名.css；

总结

以上所述是小编给大家介绍的使用nodeJs来安装less及编译less文件为css文件的方法，希望对大家有所帮助，如果大家有任何疑问请给我留言，小编会及时回复大家的。在此也非常感谢大家对我们网站的支持！

赞 (0)

相关推荐

  • VueJS如何引入css或者less文件的一些坑

    VueJS如何引入css或者less文件的一些坑

    我们在做Vue+webpack的时,难免会引入各种公共css样式文件,那么我们改如何引入呢?引入时会有那些坑呢? 首先,引入公共样式时,我们在"main.js"里使用AMD的方式引入,即 require('./assets/css/main.less'); 这时,我们会抛出一个错误,是因为我们没有写解析的依赖,webpack不知道怎么解析 这时,我们要填写上依赖, require('!style!css!less!./assets/css/main.less'); 在很多以前的博客里都

  • 前端构建 Less入门(CSS预处理器)

    Less 是一门 CSS 预处理语言,它扩充了 CSS 语言,增加了诸如变量.混合(mixin).函数等功能,让 CSS 更易维护.方便制作主题.扩充. Less 可以运行在 Node.浏览器和 Rhino 平台上.网上有很多第三方工具帮助你编译 Less 源码. 一.前言 说到前端构建怎能缺少CSS预处理器呢!其实CSS的预处理器有很多啦,比较出名的有Scss.Sass.Stylus和Less.(最近还听说出现了Autoprefixer等CSS后处理器,可参考@一丝的PPT) 众多CSS预处理

  • yii2简单使用less代替css示例

    添加组件php composer.phar require --prefer-dist singrana/yii2-less "*" 修改配置文件`main.php' 'components' => [ 'assetManager' => [ 'converter' => [ 'class' => \singrana\assets\Converter::className(), ], ], ], 在AppAsset中 class AppAsset extends

  • Vue项目中引入外部文件的方法（css、js、less）

    Vue项目中引入外部文件的方法（css、js、less）

    这两天学习了Vue.js ,正好了解了如何引入外部文件的方法,而且很重要,所以,今天添加一点小笔记. 例子中css文件采用bootstrap.css,js文件采用jQuery,less文件用less.less(自定义文件) 步骤一:安装webpack cnpm install webpack -g 步骤二:在src/assets下面新建css.js.less.fonts文件夹,并放入对应文件. 将bootstrap.css放入css目录下,bootstrap.min.js放入js文件下,font

  • Webpack中css-loader和less-loader的使用教程

    Webpack中css-loader和less-loader的使用教程

    前言 在Webpack中,通过css-loader,可以实现在js文件中通过require的方式,来引入css.下面来看看详细的介绍吧. 一.css-loader 我们需要在js文件里,通过require的方式来引入css,我们来看具体的方法,首先需要安装css-loader, style-loader(安装style-loader的目的是为了在html中以style的方式嵌入css). npm install css-loader,style-loader --save-dev 然后在main

  • Lesson03_01 什么是CSS和CSS的设置方式

    第3讲 CSS 何为CSS CSS的几种设置方式 样式规则选择器 样式规则的注释与有效范围 样式属性详解 什么是CSS和CSS的设置方式 作者:Loncer 更多学习资源尽在:wwww.loncer.cn 什么是CSS    CSS即:Cascading Style Sheets这几个英文单词的缩写,中文为:层叠样式表.它除了可以轻松设置网页元素的显示位置和格式外,还能产生滤镜,图像淡化,网页淡入淡出的渐变效果.简而言之.CSS就是要对网页的显示效果实现与Word一样的排版控制.例如下的代码:<

  • 详解Angular-cli生成组件修改css成less或sass的实例

    详解Angular-cli生成组件修改css成less或sass的实例 使用cli命令生成组件: ng generate component 组件名 生成出来的组件文件有:html / ts / css / spec.ts 问题我是一个less重度患者怎么可能再去写css呢. 于是我就在想使用cli生成组件的时候能直接生成出来的是less文件而不是css文件: 修改angular-cli.json文件: apps "styles": [ "styles.less"

  • webpack处理 css\less\sass 样式的方法

    webpack处理 css\less\sass 样式的方法

    本文介绍了webpack处理 css\less\sass 样式的方法,分享给大家,具体如下: (一)处理普通的.css 文件,需要安装 css-loader,style-loader .less 文件,需要安装 less-loader .sass 文件,需安装  less-loader npm install --save-dev css-loader npm install --save-dev css-loader npm install less-loader --save-dev (二)

  • 使用nodeJs来安装less及编译less文件为css文件的方法

    使用nodeJs来安装less及编译less文件为css文件的方法

    NodeJs 使用nodejs安装less以及编译less文件为css文件 首先下载nodeJs的安装包,按照步骤,安装nodejs. 链接:http://pan.baidu.com/s/1dEsqYB3 密码:bkkh  这个链接里面有nodejs的安装包,大家可以直接下载下来,安装就可以了. 然后cmd打开控制台,检查node是否安装成功.输入node –v,如果输出的是安装包的版本号,则表示安装成功. 接下来就可以安装less了,进入node.js安装目录,通过命令npm install

  • Nodejs全局安装和本地安装的不同之处

    Nodejs全局安装和本地安装的不同之处

    上一篇文章<Nodejs中 npm常用命令详解>主要是整理了最常使用的npm命令及相关介绍,其中有提到全局安装(npm install gulp -g)和本地安装(npm install gulp),下图来自Gulp中文网入门指南,可以看出全局安装后gulp后还要进行本地安装,一开始我疑惑了?为什么全局安装的gulp么,还要进行本地安装,难道不能在项目中直接调用本地安装的包? 带着疑惑,在google找了相关文档,杂七杂八凑合起来才有了点眉目,让我们一起解开nodejs全局安装和本地安装的一些

  • Linux环境下nodejs的安装图文教程

    Linux环境下nodejs的安装图文教程

    1.在官网下载nodejs,选择左边的. 2.选择文件右击点击extract here进行解压 3.进入bin目录,右击选择properties,解压文件可以随意放在系统里一个位置.复制location里的路径 4.添加路径 进入.bashrc文件,在末尾处添加步骤三的location里的路径. 6.在终端输入source .bashrc按回车键,再输出路径:echo $PATH检查路径是否已经添加成功 7.检测是否安装nodejs成功.在js文件目录下点击右键,再点击open in termi

  • 解决Nodejs全局安装模块后找不到命令的问题

    碰到了这问题,记录一下,看提示应该是环境变量的问题,执行如下命令得到Nodejs的模块安装路径: npm prefix -g 将输出的全局安装路径加入的环境变量的Path条目中即可. 以上这篇解决Nodejs全局安装模块后找不到命令的问题就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持我们. 您可能感兴趣的文章: Nodejs全局安装和本地安装的不同之处 npm全局模块卸载及默认安装目录修改方法 解决node.js安装包失败的几种方法 修改npm全局安装模式的路径方法 n

  • nodejs的安装使用与npm的介绍

    Node.js是一个Javascript运行环境(runtime environment),发布于2009年5月,由Ryan Dahl开发,实质是对Chrome V8引擎进行了封装.本文详细介绍了Node.js的安装和使用. 一.Node.js介绍 Node.js 不是一个 JavaScript 框架,不同于CakePHP.Django.Rails.Node.js 更不是浏览器端的库,不能与 jQuery.ExtJS 相提并论.Node.js 是一个让 JavaScript 运行在服务端的开发平

  • 安装PHP扩展时解压官方 tgz 文件后没有configure文件无法进行配置编译的问题

    我们以 PHP 扩展 zip 为例 访问PHP 官方插件库 搜索我们所需要的扩展 zip,我们选择最新的 stable 版本,进行下载 解压 tgz 下载到本地后,使用 tar -zxvf filename.tgz cd 进入文件,我们发现并不存在 .configure 文件,用于我们进行编译 这时我们使用 phpize 命令 执行完成后,即可展示我们熟悉的编译内容 即可进行正常的编译安装 参考文章: PHP 中 config.m4 的探索 总结 到此这篇关于安装PHP扩展时解压官方 tgz 文

  • Elasticsearch插件及nodejs的安装配置

    目录 Elasticsearch插件介绍 核心插件 第三方插件 插件安装 第一种:命令行 第二种:url安装 第三种:离线安装 安装nodejs 一 nodejs介绍 二 查看原来的镜像地址 三 npm切换阿里源 四 安装cmpm 五 改变原有的环境变量 Elasticsearch插件介绍 es插件是一种增强Elasticsearch核心功能的途径.它们可以为es添加自定义映射类型.自定义分词器.原生脚本.自伸缩等等扩展功能. es插件包含JAR文件,也可能包含脚本和配置文件,并且必须在集群中的

  • iredmail下安装脚本分析（一）---get_all.sh 文件所在目录为PKGS

    iredmail下安装脚本分析（一）---get_all.sh 文件所在目录为PKGS

    iredmail是一套以postfix为核心的整合邮件系统的安装脚本,可以达到快速部署邮件服务器的目的. 经过上面的一系列分析后,进入到获取安装包的步骤,作者在此处单独写了一个脚本,get_all.sh,我们继续分析这个脚本 _ROOTDIR="$(pwd)" CONF_DIR="${_ROOTDIR}/../conf" . ${CONF_DIR}/global . ${CONF_DIR}/core . ${CONF_DIR}/iredadmin 程序的意思是利用p

  • PHP动态编译出现Cannot find autoconf的解决方法

    本文详细讲述了PHP动态编译出现Cannot find autoconf的解决方法.分享给大家供大家参考.具体方法如下: 在安装完PHP后,想动态编译PHP的memcache扩展库 复制代码 代码如下: cd memcache-2.2.5/ /usr/local/webserver/php/bin/phpize ./configure --with-php-config=/usr/local/webserver/php/bin/php-config 但是执行/usr/local/webserve

  • nodejs使用express获取get和post传值及session验证的方法

    本文实例讲述了nodejs使用express获取get和post传值及session验证的方法.分享给大家供大家参考,具体如下: 获取get和post传值 get的传值被放入了一个对象中 req.query post的传值被放入了 req.body 获取方式如获取对象的内容方式一样.比如,前面传入了一个id的值,nodejs获取就可以req.body.id即可 express的session验证 第一步安装cookie和session的模块,并引入 var session = require('

随机推荐