I saw a lot of excellent resources in this garden, and I also wanted to write something. I suddenly thought of the solution to the problem of Chinese garbled characters when writing sass. I just summarized everything myself. (The following test steps are all completed by myself! There is no reproduction. If there are any errors, I hope everyone will correct them)
A brief explanation: It is much more convenient to write css styles in sass. It allows us to write css syntax that does not have logical processing capabilities in sass and has simple logical processing capabilities.
The installation of sass will not be introduced in detail here. The process is roughly like this Install ruby --- Install sass -- Configure sass in webstrom
1: By modifying the sass configuration file
First of all, the configuration file of sass usually exists in the directory where ruby is installed.
This is my ruby installation directory. After finding it, look for the files we need to configure in this folder:
If the version you installed is the same as mine, then it is roughly the following path,
Ruby23-x64librubygems2.3.0gemssass-3.4.22libsass
There is a configuration file under sass:
engine.rb file;
Open------
Add the following code here: Encoding.default_external = Encoding.find('utf-8');
----save You’re done Go and try it!
ok perfect! ;
Two: By adding @charset "UTF-8";
If you use this method, you need to add it when you use Chinese. The first method is that sass will automatically add it for you. The principle is still the same;
The place to add it is in your sass file
(Don’t forget to add it to the css generated by sass, because every addition will be invalid, because the content of the compiled css will only change with the content of the corresponding sass file)
The results obtained by this method are still consistent.
Questions about Chinese paths:
Last question about the Chinese path: I have also tried this problem, but there will still be some minor problems in the end, so everyone is told not to use the Chinese path.
Final note: This content is summarized by myself and written very simply. If there are any deficiencies or errors, I hope you will correct me!