parent
d823c08a0a
commit
d945af6d3e
|
@ -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)
|
||||||
|
|
||||||
|
|
15
README.md
15
README.md
|
@ -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
|
||||||
|
```
|
15
README_ZH.md
15
README_ZH.md
|
@ -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
|
||||||
|
```
|
55
index.js
55
index.js
|
@ -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__)
|
||||||
|
|
|
@ -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",
|
||||||
|
|
|
@ -0,0 +1,4 @@
|
||||||
|
{
|
||||||
|
"browsers": ["ie > 9", "iOS > 8", "Android >= 4.4", "ff > 38", "Chrome > 38"],
|
||||||
|
"outdir": "dist"
|
||||||
|
}
|
|
@ -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}
|
||||||
|
|
|
@ -2,4 +2,5 @@ ul {
|
||||||
display: flex;
|
display: flex;
|
||||||
|
|
||||||
li {flex: 2;color: #fff;}
|
li {flex: 2;color: #fff;}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
Loading…
Reference in New Issue