【前端vue开发】vue项目使用sass less扩展语言所要安装的依赖
1、创建一个基于 webpack 模板的新项目
$ vue init webpack myvue
2、在当前目录下,安装依赖
$ cd myvue
$ npm install
3、安装sass的依赖包
npm install --save-dev sass-loader
//sass-loader依赖于node-sass
npm install --save-dev node-sass
4、在build文件夹下的webpack.base.conf.js的rules里面添加配置
{
test: /\.sass$/,
loaders: ['style', 'css', 'sass']
}
如下图所示:
5、在APP.vue中修改style标签
<style lang="scss">
6、然后运行项目
$ npm run dev
7、修改APP.vue的样式,可以看下效果
8、运行结果背景变成灰色吗,说明你已成功配置好sass
【前端vue开发】vue项目使用sass less扩展语言所要安装的依赖的更多相关文章
- Vue开发之项目创建
1.编辑器配置 习惯使用VScode进行开发时,可以安装EditorConfig for Visual Studio Code插件,然后在项目中新建.editorconfig文件,来配置编辑器的使用习 ...
- vue开发的项目中遇到的警告,报错,配置项目文件等合集(长期更新)
1. Vue组件里面data()里面没有return时触发错误:Vue components Cannot read property '__ob__' of undefined 这个警告不解决会触发 ...
- 前端开发 Vue -1windows环境搭建Vue Node开发环境
解决几个疑问: 想学习下vue.js,我理解的它是一个前端的框架,主要作用是对数据的处理,和juqery类似,所以不太理解为什么要在nodejs中npm install vue呢?在html文件中引入 ...
- 循序渐进VUE+Element 前端应用开发(21)--- 省市区县联动处理的组件使用
在很多应用中,往往都涉及到记录用户所在省份.城市.区县或者街道等信息,一般我们可以通过联动的Select或者类似的界面组件进行展示,或者使用Element中的el-cascader界面组件进行展示,而 ...
- 从零开始搭建vue开发环境及构建vue项目
1.安装node.js 安装完成之后,打开dos(windows+R或者直接windows键打开,输入cmd,按回车键)窗口,输入命令node -v可以查看安装的 node.js版本 node.js自 ...
- vue-cli@3.x之使用vue ui创建项目-来自一个战五渣的体验
1. 全局安装vue-cli yarn global add @vue/cli // 检查安装是否成功 vue -V // 3.2.2 2. 初始化 vue ui 执行命令 vue ui 2.1 该命 ...
- windows环境搭建Vue开发环境
一.安装node.js(https://nodejs.org/en/) 下载完毕后,可以安装node,建议不要安装在系统盘(如C:). 二.设置nodejs prefix(全局)和cache(缓存)路 ...
- 《Java周边》vue开发环境搭建(windows)
1. NodeJs 安装包下载 百度云:链接: https://pan.baidu.com/s/169TdKRLZd0dXbKSGTr8evw 提取码: th4a 复制这段内容后打开百度网盘手机App ...
- 如何开发H5项目 -- 入门篇
前言 H5即HTML5,H5开发具有低成本.高效率.跨平台.研发周期短,用户接触成本低等特性. 一.开发环境 在开发一个H5项目之前,需要先搞好环境.主要有node.npm.gulp.bower.下面 ...
随机推荐
- BZOJ2529 [Poi2011]Sticks 【贪心】
题目链接 BZOJ2529 题解 要组成三角形,当且仅当最长边长度小于另两条边之和 我们就枚举最长边,另两条边当然是越大越好 我们将所有边排序,从小枚举并记录各个颜色的最长边 当枚举到当前边时,找到除 ...
- 洛谷 P1270 “访问”美术馆 解题报告
P1270 "访问"美术馆 题目描述 经过数月的精心准备,Peer Brelstet,一个出了名的盗画者,准备开始他的下一个行动.艺术馆的结构,每条走廊要么分叉为两条走廊,要么通向 ...
- Java之链表实现栈结构
package com.wzlove.stack; import java.util.Iterator; import java.util.NoSuchElementException; /** * ...
- D. Monitor Educational Codeforces Round 28
http://codeforces.com/contest/846/problem/D 二分答案 适合于: 判断在t时候第一次成立 哪个状态是最小代价 #include <cstdio> ...
- (四)关于读文件的结束的判别方法(EOF和feof)以及区别
关于读文件的时候判断文本是否读完的方式一般可以通过EOF,一般宏定义为-1.因为ASCII码中不可能出现-1. 当以文本形式读取文件内容, 读入的字符值等于EOF时, 表示读入的已不是正常的字符而是文 ...
- awk 脚本同时解析多个文件
ARGC The number of command line arguments (does not include options to gawk ...
- 三、java面向对象编程_1
目录 一.对象和类的概念 二.对象和引用 1.对象 2.成员变量 3.引用 三.java类的定义 四.构造函数(构造方法) 五.内存分析 一.对象和类的概念 1.对象 对象用计算机语言对应问题域中事物 ...
- P2787 语文1(chin1)- 理理思维
P2787 语文1(chin1)- 理理思维 1.获取第x到第y个字符中字母k出现了多少次 2.将第x到第y个字符全部赋值为字母k 3.将第x到第y个字符按照A-Z的顺序排序 读字符串我再单个单个读我 ...
- HTTP 错误 500.19 请求的页面的相关配置数据无效 解决办法
"HTTP 错误 500.19 请求的页面的相关配置数据无效" 解决办法 HTTP 错误 500.19 - Internal Server Error无法访问请求的页面,因为该 ...
- bzoj千题计划148:bzoj1537: [POI2005]Aut- The Bus
http://www.lydsy.com/JudgeOnline/problem.php?id=1537 朴素的转移:dp[i][j]=max(dp[i][j-1],dp[i-1][j])+p[i][ ...