Electron 12 学习（五）sass-loader 安装与配置

1. 安装sass-loader：

   npm i -D sass-loader
   

2. 测试scss文件：
   • 新建文件src/style/app.scss：
   • 将src/App.vue内的样式剪切到src/style/app.scss：

     #app {
       font-family: Avenir, Helvetica, Arial, sans-serif;
       -webkit-font-smoothing: antialiased;
       -moz-osx-font-smoothing: grayscale;
       text-align: center;
       color: #2c3e50;
       margin-top: 60px;
     }
     

   • 在src/App.vue内引入src/style/app.scss：

     <template>
       <img alt="Vue logo" src="./assets/logo.png">
       <HelloWorld msg="Welcome to Your Vue.js App"/>
     </template>
     
     <script>
     import HelloWorld from './components/HelloWorld.vue'
     
     export default {
       name: 'App',
       components: {
         HelloWorld
       }
     }
     </script>
     
     <style>
     @import "../src/style/app.scss";
     
     </style>
     

   • 启动项目，查看效果。
3. 源码：
   GitHub
   Gitee
   CodeChina