Node环境 通过 node.js 网站下载了安装包进行安装 node.js, npm也会一起安装 node --version # 查看node.js版本 npm --version #查看npm版本 npx --version 通过命令配置 npm 淘宝镜像 npm config set registry https://registry.npm.taobao.org npm config get registry #验证命令 npm config list #列出当前npm的配置列表 定位…

使用 gulp 编译 Sass Sass 是一种 CSS 的开发工具,提供了许多便利的写法,大大节省了开发者的时间,使得 CSS 的开发,变得简单和可维护. 安装 npm install gulp-sass (--save-dev) 括号中的可选 基本用法 Something like this will compile your Sass files: 'use strict'; var gulp = require('gulp');var sass = require('gulp-sass'…

关于这个的问题,虽说不是很难,但还是踩了点小坑,下面就来介绍下如何使用webstorm配置编译sass的输出目录. 1.下载Ruby 2.使用Ruby安装sass 3.检测是否安装成功. 前面的几步很多教程上都有,就不详细说了. 一般来说,我们期望scss目录和css目录是单独分开的,在scss目录中建立index.scss的文件.会弹出如上提示,点击yes,如果不小心点了no的话-- 一样可以进入这个页面. 如果这样的默认路径,编译好的css文件是会直接生成在scss文件下. 但是我们可以将A…

{ "compilerOptions": { /* 基本选项 */ "target": "es5", // 指定 ECMAScript 目标版本: 'ES3' (default), 'ES5', 'ES2015', 'ES2016', 'ES2017', or 'ESNEXT' "module": "commonjs", // 指定使用模块: 'commonjs', 'amd', 'system', 'um…

简介:node express或者就是node项目中,要自动编译sass方法很多,比如gulp 比如考拉,比如今天我想说的这个包node-compass. 编译sass的三种方法: 前提条件: 都需要电脑中安装好ruby和compass. 方法一: 命令行编译sass: 方法二:gulp-sass 方法三:node-compass 方法一: 命令行编译sass: compass compile 回车确认即可生成对应的css代码.新生成的css文件与sass文件在同一目录下.这是最基础的sass编…

在Visual Studio 2017中使用gulp编译sass/scss文件 需要的环境:Visual Studio 2017.Node.js.npm 在vs2017中 [视图]-[其他窗口]-[任务运行程序资源管理器]打开. 在学习的时候,发生网上讲的大多都是的gulpfile.js里面的核心内容,因此我这里写下我的详细操作步骤留作笔记. 步骤: 1.运行:cmd 2.运行:cd 到项目的根目录 3.运行:npm init 初始化package.json (一直Enter到底,也可以按照提示…

Gulp 是一个自动化工具,前端开发者可以使用它来处理常见任务: 1.搭建web服务器 2.文件保存时自动重载浏览器 3.使用预处理器如Sass.LESS 4.优化资源,比如压缩CSS.JavaScript.压缩图片 当然Gulp能做的远不止这些.如果你够疯狂,你甚至可以使用它搭建一个静态页面生成器.Gulp真的足够强大,但你必须学会驾驭它. 这是这篇文章的主要目的.帮助你了解Gulp的基础用法,助你早日完成一统天下的大业. 我们将要做的 这篇文章的最后,你会拥有简单的一个工作流: 编译Sass…

前言:前段时间学习了sass语法,但是一直用的是"考拉"这个软件工具将我写的sass代码编译成css,然后再引用到项目里面去的,随着对sass的更加深入的了解,我开始尝试着将sass写入gulp,下面就介绍如何将sass写入gulp,完成一系列自动化编译. ①.安装gulp-sass  :npm install gulp-sass --save-dev ②.写入gulpfile.js:var sass = requrie('gulp-sass') gulp.task('sass', f…

之前写了一篇在ruby环境下如何编译sass的文章:<css预处理器sass使用教程(多图预警)>,随着现在前端构建工具的兴起,也学着使用这些工具来编译sass.webpack存在一个CSS的处理平台-PostCSS,它可以帮助你的CSS实现更多的功能,安装了postcss-loader 和 autoprefixer插件之后,配置相关的loaders就可以编译使用了.我这里想介绍一下使用gulp编译sass的方法. node装好之后,可以新建一个叫gulp的文件夹,在这个文件夹下面打开命令行窗…

无论是 node-sass 还是 ruby-sass 使用 npm 安装都非常的慢,甚至会装不上.及其不利于团队协作.建议使用 less 作为 css 预处理器. 如果因为 less 不支持自定义函数选择用 sass 可以使用 less-plugin-functions 让 less 支持自定义函数. gulp-sass 本章使用的是 ruby-sass 如果你不方便安装 ruby 或编译速度慢,建议使用 gulp-sass 请务必理解如下章节后阅读此章节: 安装 Node 和 gulp 使用…