时间:2021-05-26
1,使用save会在package.json中自动添加。
npm install node-sass --save-devnpm install sass-loader --save-dev注:
通常使用npm安装会出现以下报错,安装失败。(网路问题)
可以通过淘宝的npm镜像安装node-sass,解决以上问题。
$ npm install -g cnpm --registry=https://registry.npm.taobao.org (安装淘宝镜像)$ cnpm install node-sass --save (使用淘宝镜像安装node-sass)2.进入webpack.base.config.js 配置scss module -- loaders (vue1.0)
$ npm install --save-dev sass-loader style-loader css-loader{ test: /\.vue$/, loader: 'vue-loader', options: { loaders: { 'scss': 'style-loader!css-loader!sass-loader' } } }打开webpack.base.config.js在loaders里面加上 module -- rules (vue2.0)
rules: [ { test: /\.vue$/, loader: 'vue-loader', options: vueLoaderConfig }, { test: /\.js$/, loader: 'babel-loader', include: [resolve('src'), resolve('test')] }, { test: /\.(png|jpe?g|gif|svg)(\?.*)?$/, loader: 'url-loader', query: { limit: 10000, name: utils.assetsPath('img/[name].[hash:7].[ext]') } }, { test: /\.scss$/, loaders: ["style", "css", "sass"] }, { test: /\.(woff2?|eot|ttf|otf)(\?.*)?$/, loader: 'url-loader', query: { limit: 10000, name: utils.assetsPath('fonts/[name].[hash:7].[ext]') } } ] }3.如果需要在vue文件style标签使用scss的话,需要声明一下:
vue1.0
<style rel="stylesheet/scss" lang="scss"></style>vue2.0
<style lang="scss" scoped="" type="text/css"></style>以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持。
声明:本页内容来源网络,仅供用户参考;我单位不保证亦不表示资料全面及准确无误,也不保证亦不表示这些资料为最新信息,如因任何原因,本网内容或者用户因倚赖本网内容造成任何损失或损害,我单位将不会负任何法律责任。如涉及版权问题,请提交至online#300.cn邮箱联系删除。
一、如何去除vue项目中访问地址的#vue2中在路由配置中添加mode(vue-cli创建的项目在src/router/index.js)exportdefau
在vue2项目中,组件间相互传值或者后台获取的数据需要供多个组件使用的情况很多的情况下(后台获取数据存入vuex,组件之间共享数据),那么就需要用vuex来管理
目前,项目中使用了纯前端的静态项目+RESTFul接口的模式。为了更好的对数据进行操作,前端使用了vue2的mvvm功能,但是由于不是单页面应用,所以,并没有涉
前端项目打包工具webpack与前端开发框架vue,算是现在前后端分离后非常流行的技术了,今天主要讲的是使用webpack和vue2构建一个前后端分离项目的基本
本文实例为大家分享了Bootstrap标签页的具体实现代码,供大家参考,具体内容如下HTML代码:项目一项目二项目三购买材料1购买材料2购买材料3购买材料4购买