This is the 12th day of my participation in the August Text Challenge.More challenges in August

Compile the way

Sass Chinese: Compile sASS

  • Command line compilation, software compilation, vscode plug-in compilation, see the above links
  • Vscode plug-ins haveLive Sass Compiler 和 Easy Sass

Live Sass Compiler

  • Live Sass CompilerMany people use it and depend on itLive Server, so install if there is noLive ServerIt will be automatically installed.
  • Install complete click on the bottom of vscodewatch SassTo start real-time compilation.
  • Sass Chinese language: Live Sass Compiler
  • Github: Common Settings
    • You can set the four compiled CSS styles, name extensions, and save locations
    • You can set the compilation to exclude a specified folder, or to exclude files outside the specified file
    • Or set only the specified file to compile
    • You can set the suffix to be compiled. For small programs, the suffix WXSS can be compiled
    • , etc.
  • Bug: The line number of the generated map file is incorrect. There are many issues in Github.

Use skills

  • Click on thewatch SassSass and.scss files in your open folder will be automatically compiled because of this default setting

  • But most people just want to compile the current file most of the time
  • After some research, the rule is this (Different versions may have different rules, this plugin is 3.00 version, this configuration is really not user-friendly)
    • == No matter how includeItems and excludeList are set, the current file will be compiled when modified and saved ==. This is easy, == Set excludeList to exclude all files ==
  • The following Settings 
    "liveSassCompile.settings.excludeList": [
    "* *"].Copy the code
    • A quick note on his wildcard rule (it may vary from version to version)
      • The open file is the root directory
      • *On behalf of the file
      • 支那Represents all files and folders in this layer

Easy Sass

The only drawback of this lightweight version is that it can’t generate csS.map files

  • Although there are fewer downloads than Live Sass, I personally feel it is more convenient than Live Sass. There is no css.map generation function (but live Sass also generates incorrect CSs.map and requires the above steps to be optimized to work, so easy Sass is much more convenient without the advantages of CSs.map).
  • Only the current changes are compiled and the saved sass files are executed
  • Common Settings
    • Save files for automatic compilation
    • You can set the four compiled CSS styles, name extensions, and save locations
    • You can set compilation to exclude specified folders
    • , etc.