首个正式版
parent
5b3d80a90a
commit
bc7f1ce030
|
@ -0,0 +1,4 @@
|
|||
[
|
||||
{ "caption": "-", "id": "file" },
|
||||
{ "command": "compile_scss", "caption": "Compile This Scss..." }
|
||||
]
|
|
@ -0,0 +1,34 @@
|
|||
[
|
||||
{
|
||||
"caption": "Preferences",
|
||||
"mnemonic": "n",
|
||||
"id": "preferences",
|
||||
"children":
|
||||
[
|
||||
{
|
||||
"caption": "Package Settings",
|
||||
"mnemonic": "P",
|
||||
"id": "package-settings",
|
||||
"children":
|
||||
[
|
||||
{
|
||||
"caption": "Scss Compiler",
|
||||
"children":
|
||||
[
|
||||
{
|
||||
"command": "open_file",
|
||||
"args": {"file": "${packages}/scss-compiler/ScssCompiler.sublime-settings"},
|
||||
"caption": "Settings – Default"
|
||||
},
|
||||
{
|
||||
"command": "open_file",
|
||||
"args": {"file": "${packages}/User/ScssCompiler.sublime-settings"},
|
||||
"caption": "Settings – User"
|
||||
}
|
||||
]
|
||||
}
|
||||
]
|
||||
}
|
||||
]
|
||||
}
|
||||
]
|
|
@ -0,0 +1,27 @@
|
|||
# scss-compiler
|
||||
> 可用于对scss文件进行简单的编译/压缩, 而不用安装各种前端工程化工具(webpack等)。
|
||||
|
||||
## 出现的契机
|
||||
> 对于小项目来说, webpack等各种工程化工具, 实在过于重, 配置又繁琐。 而且还要安装一大堆模块。
|
||||
> 有时候,我们只想简单的使用scss带来的便捷而已。所以本着这个目的, 我自己写了一个Sublime的插件, 可以在scss文件保存的时候, 自动编译成css文件(存于当前目录)。
|
||||
|
||||
|
||||
## 兼容性
|
||||
> 理论上, 兼容Linux/MacOS/Windows, 不过我只在Linux下测试过, 其他的系统, 请自行测试,有什么问题, 可以提issue。
|
||||
|
||||
## 依赖
|
||||
> 既然是scss编译的, 当然就依赖于scss模块。
|
||||
> scss模块, 可以使用js版的, 也可以使用ruby版的。
|
||||
|
||||
```bash
|
||||
# 这是js版的, 可以使用npm来安装
|
||||
sudo npm i node-sass -g
|
||||
|
||||
# 这是ruby版的, 可以使用 gem来安装
|
||||
sudo gem install sass
|
||||
```
|
||||
|
||||
|
||||
## 插件安装
|
||||
> 目前只能通过下载方式, 复制到sublime的插件目录,进行安装使用。
|
||||
|
|
@ -0,0 +1,19 @@
|
|||
{
|
||||
// Auto compile the scss file into css on file save?
|
||||
// default saving rule: demo.scss -> demo.css
|
||||
// It will be saved in current dir.
|
||||
"compile_on_save": true,
|
||||
|
||||
//It will compress css file if it set to be true
|
||||
"compress_on_compile": true,
|
||||
|
||||
// Only work on compress_on_compile set to false
|
||||
// value can be one of these three:
|
||||
// nested/compact/expanded
|
||||
"compile_style": "expanded",
|
||||
|
||||
|
||||
// How to link generated output to the source file.
|
||||
"sourcemap": false
|
||||
|
||||
}
|
|
@ -0,0 +1,98 @@
|
|||
import sublime
|
||||
import sublime_plugin
|
||||
import subprocess
|
||||
import re
|
||||
import os
|
||||
|
||||
|
||||
def get_setting(key, default=None):
|
||||
|
||||
settings = sublime.load_settings('ScssCompiler.sublime-settings')
|
||||
os_specific_settings = {}
|
||||
|
||||
return os_specific_settings.get(key, settings.get(key, default))
|
||||
|
||||
|
||||
def compile_scss(scss_file):
|
||||
|
||||
shoud_compress = get_setting('compress_on_compile')
|
||||
|
||||
compile_style = get_setting('compile_style')
|
||||
|
||||
sourcemap = get_setting('sourcemap')
|
||||
|
||||
|
||||
args = ['scss', '-C', '-t']
|
||||
|
||||
if shoud_compress:
|
||||
args.append('compressed')
|
||||
else:
|
||||
args.append(compile_style)
|
||||
|
||||
if sourcemap:
|
||||
args.append('--sourcemap=auto')
|
||||
else:
|
||||
args.append('--sourcemap=none')
|
||||
|
||||
args.append(scss_file)
|
||||
|
||||
cssfile = scss_file[0:-4] + 'css'
|
||||
|
||||
args.append(cssfile)
|
||||
|
||||
pipe = subprocess.Popen(args, stderr=subprocess.PIPE)
|
||||
(out, err) = pipe.communicate()
|
||||
return err.decode('utf-8')
|
||||
|
||||
|
||||
|
||||
class ScssCompiler(sublime_plugin.EventListener):
|
||||
def on_post_save(self, view):
|
||||
|
||||
shoud_compile = get_setting('compile_on_save')
|
||||
scss_file = view.file_name()
|
||||
|
||||
if not shoud_compile:
|
||||
return
|
||||
|
||||
if not re.search(r'\.scss$', scss_file):
|
||||
return
|
||||
|
||||
if os.path.basename(scss_file) == 'var.scss':
|
||||
return
|
||||
|
||||
err_msg = compile_scss(scss_file)
|
||||
|
||||
if err_msg:
|
||||
view.show_popup(err_msg)
|
||||
|
||||
|
||||
class __CompilerCommand():
|
||||
def get_path(self, paths):
|
||||
if paths:
|
||||
return paths[0]
|
||||
elif self.window.active_view() and self.window.active_view().file_name():
|
||||
return self.window.active_view().file_name()
|
||||
elif self.window.folders():
|
||||
return self.window.folders()
|
||||
else:
|
||||
sublime.error_message('No scss file to Compile...')
|
||||
return False
|
||||
|
||||
|
||||
class CompileScssCommand(sublime_plugin.WindowCommand, __CompilerCommand):
|
||||
|
||||
def run(self, paths=[]):
|
||||
|
||||
path = self.get_path(paths)
|
||||
if not path:
|
||||
return
|
||||
|
||||
print(path)
|
||||
|
||||
if not re.search(r'\.scss$', path):
|
||||
sublime.error_message('This is not a scss file ...')
|
||||
return
|
||||
|
||||
compile_scss(path)
|
||||
|
Loading…
Reference in New Issue