pull/19/head 2.0.0
宇天 2019-02-14 13:38:11 +08:00
parent d823c08a0a
commit d945af6d3e
8 changed files with 78 additions and 25 deletions

View File

@ -1,8 +1,15 @@
# 更新日志(Changed Logs) # 更新日志(Changed Logs)
## [2.0.0] 2019-02-14
- 大版本改动,移除 `.browserslistrc`的支持, 改用`.scssrc`;
- 新增`outdir`选项支持, 允许将编译后的css文件统一存放.
## [1.2.0] 2019-01-05 ## [1.2.0] 2019-01-05
- 配置优化 - 配置优化
## [1.1.1] 2018-12-27 ## [1.1.1] 2018-12-27
- 更换sass库,兼容win10 [#1](https://github.com/yutent/scss-to-css/issues/1) - 更换sass库,兼容win10 [#1](https://github.com/yutent/scss-to-css/issues/1)

View File

@ -33,7 +33,7 @@ Live demo:
> Search `scss-to-css` and install in the marketplace. > Search `scss-to-css` and install in the marketplace.
## .browserslistrc DEMO ## .browserslistrc DEMO (Deprecated in 2.x)
> Just for demo, you can change it by youself. If not exists, the default value will be `last 2 version`. > Just for demo, you can change it by youself. If not exists, the default value will be `last 2 version`.
``` ```
@ -43,3 +43,16 @@ Android >= 4.4
ff > 38 ff > 38
Chrome > 38 Chrome > 38
``` ```
## .scssrc DEMO (in 2.x or above)
> instead of using `.browserslistrc`, we recommend to use `.scssrc`.
```json
{
"browsers": ["ie > 9", "iOS > 8", "Android >= 4.4", "ff > 38", "Chrome > 38"],
"outdir": "dist" // relative path of this '.scssrc' file.
}
// You can also set other config in this file.
// eg. compileOnSave,autoPrefixer,output,exclude
```

View File

@ -31,7 +31,7 @@
> 直接在商店搜索安装即可。 > 直接在商店搜索安装即可。
## .browserslistrc 示例 ## .browserslistrc 示例(2.x版之后已弃用)
> 这只是个示例, 可自行根据项目需求, 修改配置。 没有配置则默认为 `last 2 version` > 这只是个示例, 可自行根据项目需求, 修改配置。 没有配置则默认为 `last 2 version`
``` ```
@ -41,3 +41,16 @@ Android >= 4.4
ff > 38 ff > 38
Chrome > 38 Chrome > 38
``` ```
## .scssrc DEMO (2.x版及以上)
> 与其使用 `.browserslistrc`, 我们更推荐使用`.scssrc`文件来配置编译选项。且写在该文件上的配置, 优先级要高于全局的配置项。
```json
{
"browsers": ["ie > 9", "iOS > 8", "Android >= 4.4", "ff > 38", "Chrome > 38"],
"outdir": "dist" //相对.scssrc文件的目录
}
// 你也可以在此配置里设置其他选项, 将会覆盖全局的配置.
// 如: compileOnSave,autoPrefixer,output,exclude
```

View File

@ -37,6 +37,10 @@ let options = {
} }
const compileCss = (style, entry, output) => { const compileCss = (style, entry, output) => {
if (options.outdir) {
let tmp = output.replace(options.workspace, '.')
output = path.join(options.outdir, tmp)
}
return render(style, entry).then(css => { return render(style, entry).then(css => {
if (options.autoPrefixer) { if (options.autoPrefixer) {
return prefixer.process(css, { from: '', to: '' }).then(result => { return prefixer.process(css, { from: '', to: '' }).then(result => {
@ -51,7 +55,7 @@ const compileCss = (style, entry, output) => {
const Compiler = { const Compiler = {
compile(doc) { compile(doc) {
let origin = doc.fileName || '' let origin = doc.fileName || ''
let target = origin.replace(/\.scss$/, '.') let target = origin.replace(/\.scss$/, '')
let task = [] let task = []
// 说明不是scss文件 // 说明不是scss文件
@ -60,14 +64,14 @@ const Compiler = {
} }
task = options.output.map(style => { task = options.output.map(style => {
let ext = 'css' let ext = '.css'
switch (style) { switch (style) {
case 'compressed': case 'compressed':
ext = 'min.' + ext ext = '.min' + ext
break break
default: default:
ext = style.slice(0, 1) + '.' + ext ext = style.slice(0, 1) + ext
} }
return { style, output: target + ext } return { style, output: target + ext }
@ -75,7 +79,7 @@ const Compiler = {
// 编译单一类型, 则去掉文件名微调 // 编译单一类型, 则去掉文件名微调
if (task.length === 1) { if (task.length === 1) {
task[0].output = target + 'css' task[0].output = target + '.css'
} }
task = task.map(item => { task = task.map(item => {
@ -124,40 +128,51 @@ const Compiler = {
function __init__() { function __init__() {
let conf = vsc.workspace.getConfiguration('Scss2css') let conf = vsc.workspace.getConfiguration('Scss2css')
let folders = vsc.workspace.workspaceFolders
let wsDir = ''
let configFile = ''
Object.assign(options, conf) Object.assign(options, conf)
conf = null
options.output = options.output.split('|').map(it => it.trim()) options.output = options.output.split('|').map(it => it.trim())
}
function activate(ctx) {
let folders = vsc.workspace.workspaceFolders
let wsf = ''
let browsersrc = ''
if (folders && folders.length) { if (folders && folders.length) {
wsf = folders[0].uri.path wsDir = folders[0].uri.path
} }
if (wsf) {
browsersrc = path.join(wsf, '.browserslistrc') if (wsDir) {
configFile = path.join(wsDir, '.scssrc')
} else { } else {
let editor = vsc.window.activeTextEditor let editor = vsc.window.activeTextEditor
if (editor) { if (editor) {
wsf = path.dirname(editor.document.fileName) wsDir = path.dirname(editor.document.fileName)
browsersrc = path.join(wsf, '.browserslistrc') configFile = path.join(wsDir, '.scssrc')
} }
} }
if (fs.exists(browsersrc)) { // 以配置文件所在目录为根目录(workspace)
options.browsers = fs if (fs.exists(configFile)) {
.cat(browsersrc) options.workspace = path.dirname(configFile)
.toString()
.split(/[\n\r]/) let tmp = JSON.parse(fs.cat(configFile).toString())
Object.assign(options, tmp)
tmp = null
if (options.outdir) {
options.outdir = path.join(options.workspace, options.outdir)
}
} }
prefixer = postcss().use( prefixer = postcss().use(
autoprefixer({ autoprefixer({
browsers: options.browsers browsers: options.browsers
}) })
) )
}
function activate(ctx) {
__init__() __init__()
vsc.workspace.onDidChangeConfiguration(__init__) vsc.workspace.onDidChangeConfiguration(__init__)

View File

@ -2,7 +2,7 @@
"name": "scss-to-css", "name": "scss-to-css",
"displayName": "scss-to-css", "displayName": "scss-to-css",
"description": "🔥 The easiest way to compile scss file to css. And autoprefixer at the same time.", "description": "🔥 The easiest way to compile scss file to css. And autoprefixer at the same time.",
"version": "1.2.0", "version": "2.0.0",
"publisher": "yutent", "publisher": "yutent",
"author": "Yutent [@yutent]", "author": "Yutent [@yutent]",
"icon": "logo.png", "icon": "logo.png",

4
test/.scssrc Normal file
View File

@ -0,0 +1,4 @@
{
"browsers": ["ie > 9", "iOS > 8", "Android >= 4.4", "ff > 38", "Chrome > 38"],
"outdir": "dist"
}

View File

@ -1 +1 @@
ul{display:flex}ul li{flex:2;color:#fff} ul{display:-webkit-flex;display:-ms-flexbox;display:flex}ul li{-webkit-flex:2;-ms-flex:2;flex:2;color:#fff}

View File

@ -2,4 +2,5 @@ ul {
display: flex; display: flex;
li {flex: 2;color: #fff;} li {flex: 2;color: #fff;}
} }