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

绝地灬酷狼 2022-10-14 05:25 103阅读 0赞

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][]

[GitHub]: https://github.com/xuxiaowei-com-cn/Electron-12-Study/tree/Electron_12_%E5%AD%A6%E4%B9%A0%EF%BC%88%E4%BA%94%EF%BC%89sass-loader_%E5%AE%89%E8%A3%85%E4%B8%8E%E9%85%8D%E7%BD%AE
[Gitee]: https://gitee.com/xuxiaowei-com-cn/Electron-12-Study/tree/Electron_12_%E5%AD%A6%E4%B9%A0%EF%BC%88%E4%BA%94%EF%BC%89sass-loader_%E5%AE%89%E8%A3%85%E4%B8%8E%E9%85%8D%E7%BD%AE/
[CodeChina]: https://codechina.csdn.net/xuxiaowei-com-cn/Electron-12-Study/-/tree/Electron_12_%E5%AD%A6%E4%B9%A0%EF%BC%88%E4%BA%94%EF%BC%89sass-loader_%E5%AE%89%E8%A3%85%E4%B8%8E%E9%85%8D%E7%BD%AE

发表评论取消回复

表情：

评论列表（有 0 条评论，103人围观）

还没有评论，来说两句吧...

相关阅读

相关 electron安装

electron安装 Electron安装 Electron是一种强大的桌面应用开发框架，使用HTML、CSS和JavaScript构建跨平台的应用程序。它基于No

墨蓝/ 2024年03月22日 22:29/ 0 赞/ 106 阅读

相关 electron-builder配置

"build": { "productName":"xxxx", //项目名这也是生成的exe文件的前缀名 "appId": "co

怼烎@/ 2022年12月24日 04:48/ 0 赞/ 286 阅读

相关 Electron 12 学习说明

1. 若修改`DNS`可能会导致`npm`安装失败。 2. 本博客主要讲述Electron 12.0.9及之后的版本。如果使用之前的版本，请注意：Electron 10.0

太过爱你忘了你带给我的痛/ 2022年10月15日 04:58/ 0 赞/ 169 阅读

相关 Electron 12 学习（七）Electron 自动更新

1. 搭建一个`httpd`服务器：官网：[http://httpd.apache.org/][http_httpd.apache.org] 下载地

痛定思痛。/ 2022年10月14日 05:25/ 0 赞/ 225 阅读

相关 Electron 12 学习（六）DLL 调用安装与配置

1. 注意： `32位DLL仅能在32位Node、32位Electron上运行。` `64位DLL仅能在64位Node、64位Elect

你的名字/ 2022年10月14日 05:25/ 0 赞/ 211 阅读

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

1. 安装`sass-loader`： npm i -D sass-loader 2. 测试`scss`文件：新建文件`

绝地灬酷狼/ 2022年10月14日 05:25/ 0 赞/ 104 阅读

相关 Electron 12 学习（二）Electron 12 安装与配置

1. 设置 electron 镜像： npm config set ELECTRON_MIRROR https://npm.taobao.org/m

野性酷女/ 2022年10月14日 05:25/ 0 赞/ 525 阅读

相关 Electron 12 学习（十一）Notification

1. Notification 2. [node-notifier][] 3. 源码： [GitHub][] [Gitee][] [C

小鱼儿/ 2022年10月10日 04:54/ 0 赞/ 138 阅读

相关 UBUNTU12.04 + CUDA7安装与配置

参考百度经验 [如何ubuntu12/linux 安装CUDA5.5][ubuntu12_linux _CUDA5.5] 过程一路顺畅，MARK一下。 1. 第一步

心已赠人/ 2022年08月07日 15:34/ 0 赞/ 138 阅读

相关 electron 环境配置

1、下载electron项目示例 git clone https://github.com/electron/electron-quick-start

傷城~/ 2021年07月24日 13:14/ 0 赞/ 381 阅读