您的位置:首页 > Web前端 > Node.js

安装Nodejs、npm、Less(支持生成压缩后的css)

2017-02-05 18:54 387 查看

前言

最近深入了解Bootstrap,顺便将Nodejs、npm、Less、Grunt等相关程序的安装梳理了一遍,写一几篇博文记录下,待需要时查找方便。

正式动手

安装Nodejs和npm

1.到https://nodejs.org/en/下载最新的版本,安装到d盘下,假设安装后的路径为D:\Program Files\nodejs,笔者当前的版本v6.9.4,已经集成了npm,可以从【开始】-【所有程序】-【Node.js】-【Node.js command prompt】,打开命令行(经笔者测试直接用windows自带的cmd也可以),输入以下命令查看Nodejs和npm的版本。

//查看nodejs版本
node -v
//查看npm版本
npm -v


看到以下提示说明安装成功



2. 添加环境变量,在桌面上点键计算机-【属性】-【高级系统设置】-【高级】-【环境变量】-【系统变量】-【新建】:



NODE_PATH=D:\Program Files\nodejs\node_modules\npm\

安装Less

在【Node.js command prompt】里输入以下命令

d:
cd D:\Program Files\nodejs\node_modules\npm
//下面命令是安装less,注意一定要有-g,否则还得做些其他工作
npm install less -g
//下面命令用于安装css压缩插件
npm install less-plugin-clean-css


安装完成后就可以使用lessc的命令了

//下面命令编译less文件生成css
lessc d:\styles.less d:\styles.css
//下面命令启用css压缩插件,生成压缩后的css文件
lessc d:\styles.less d:\styles.min.css -clean-css


上面的命令保能处理单个less文件,可以在WebStorm里配置Watcher,在编辑less文件的同时,自动生成css文件。详见《 在WebStorm里配置watcher实现编辑less文件时自动生成.map和压缩后的.css文件》
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签:  压缩 nodejs less