如何在vue项目中使用sass（scss）
2024-09-03 03:20:18
1.用npm/cnpm/yarn安装sass的依赖包
npm install --save-dev sass-loader
npm install --save-dev node-sass
或者：
yarn add sass-loader node-sass
2.在build目类下找到webpack.base.conf.js文件，在module的rules中插入以下代码：
module: {
rules: [
{
test: /\.vue$/,
loader: 'vue-loader',
options: vueLoaderConfig
},
{
test: /\.scss$/,
loaders: ["style", "css", "sass"]
},
{
test: /\.js$/,
loader: 'babel-loader',
include: [resolve('src'), resolve('test'), resolve('node_modules/webpack-dev-server/client')]
},
{
test: /\.(png|jpe?g|gif|svg)(\?.*)?$/,
loader: 'url-loader',
options: {
limit: 10000,
name: utils.assetsPath('img/[name].[hash:7].[ext]')
}
},
{
test: /\.(mp4|webm|ogg|mp3|wav|flac|aac)(\?.*)?$/,
loader: 'url-loader',
options: {
limit: 10000,
name: utils.assetsPath('media/[name].[hash:7].[ext]')
}
},
{
test: /\.(woff2?|eot|ttf|otf)(\?.*)?$/,
loader: 'url-loader',
options: {
limit: 10000,
name: utils.assetsPath('fonts/[name].[hash:7].[ext]')
}
}
]
},
最新文章
- 使用display:table来解决一些问题
- PHP获取指定月份的第一天开始和最后一天结束的时间戳函数
- 《Continuous Delivery》 Notes 1: The problem of delivering software
- hihocoder 1260
- RBAC权限设计
- redis配置认证密码
- jquery获取所有选中的checkbox的ID
- 【Merge Two Sorted Lists】cpp
- Ext combox 动态 检索
- 来自苹果的编程语言——Swift简单介绍
- Cortex依赖管理
- （原）SQL Server 系统提供功能的三个疑惑
- Elasticsearch 默认配置 IK 及 Java AnalyzeRequestBuilder 使用
- Java Elasticsearch新手入门教程
- jquery快速入门（四）
- e lisp 常用缓冲区函数详解
- Servlet随笔
- 使用java做paypal开发时购买东西支付不成功的原因
- Android 6.0以上 需要运行时申请的权限
- OpenGL ES天空盒子效果