首页 > 其他分享 >在Vue项目中引入公共css样式

在Vue项目中引入公共css样式

时间:2022-11-16 01:11:27浏览次数:54  
标签:Vue less 样式 文件夹 public css

通常,较为复用次数高的css样式,需要提取出来同一存放

  1. assets 资源文件夹下创建 css 文件夹

  2. css 文件夹 下创建 public.less 文件

 

public.less

.wrap{
  width: 1200px;
  margin: 0 auto;
}

 

调用时需要现在 main.js 中引入

import './assets/css/public.less';

 

组件中就可以直接调用了

标签:Vue,less,样式,文件夹,public,css
From: https://www.cnblogs.com/Dollom/p/16894570.html

相关文章

  • 通过路由对象进行判断当前css样式的显示与隐藏
    可以解决ul>li进行路由跳转而css样式的激活模式无需使用三元或函数判断就可以产生效果 示例:class="{current:$route.path==item.url}解释:current即为选......
  • vue学习面试题整理(day01)
    一、Vue的最大优势是什么?  简单易学,轻量级整个源码js文件不大,双向数据绑定,数据驱动视图,组件化,数据和视图分离,vue负责关联视图和数据,作者是中国人(尤雨溪),文档都是中文的,......
  • Vue3在Vite中配置scss并使用
     提出问题单个文件引入时,需要在每个 stylelang="scss"scoped标签下这样引入,每次都要手动引入非常麻烦,因此就想做全局配置@import"@/assets/scss/global.scss"......
  • 前端常见的Vue面试题目汇总
    请说一下响应式数据的原理默认Vue在初始化数据时,会给data中的属性使用Object.defineProperty重新定义所有属性,当页面到对应属性时,会进行依赖收集(收集当前组件中的watcher)......
  • Vue项目中使用树形控件 vue-table-width-tree-grid
    Vue项目中使用树形控件vue-table-width-tree-grid需要实现的整体效果如下:这个树形结构组件ElementUI是没有提供的,我们需要依赖第三方插件来完成。一、安装tree-ta......
  • day 26-css初步学习
    css两种改变html格式的方法:内部style:在title下添加<style>写选择器的声明 1<!--<style>-->2<!--h1{-->3<!--color:aqua;-->......
  • 后端程序员必会的前端知识-01:html、css
    第一章.HTML与CSSHTML是什么:即HyperTextMarkuplanguage超文本标记语言,咱们熟知的网页就是用它编写的,HTML的作用是定义网页的内容和结构。HyperText是指用超链......
  • Vue3解决前端跨域问题
    在vue.config.js里添加代理备注:例如vue想请求不在同一台服务器上的localhost:8080服务器的接口,在下面proxy里的target里写上要访问的服务器的前缀,然后写一个别名'/project......
  • VueBaiduMap使用记录
    项目中有用到地图,之前采用的是腾讯地图,使用后发现在IE中地图展示空白,就想着换百度地图试试,又看到有基于Vue框架的百度地图插件VueBaiduMap,正好符合我的需求;本文记录一下。......
  • 使用vue-json-editor实现json编辑框
    1、进入到自己的项目,使用npm安装vue-json-editornpminstallvue-json-editor--save2、在vue组件中使用vue-json-editor<template><div><p>vue-json-edito......