vue components & `@import css` bug
vue components @import css
not support css3 @import
https://github.com/vuejs/vue-loader/issues/138#issuecomment-436847816
@charset "UTf-8";
/**
*
* @author xgqfrms
* @license MIT
* @copyright xgqfrms
*
* @description links.css
*
*/
a {
text-decoration: none;
color: #0f0;
}
<style>
@import "./links.css";
/* global css*/
a {
text-decoration: none;
}
</style>
<style scoped lang="scss">
/* local css */
</style>
solutions
https://vuejs.org/v2/guide/single-file-components.html#What-About-Separation-of-Concerns
https://forum.vuejs.org/t/help-imported-css-styles-conflict-between-components/5687/4
<style src="./links.css">
<style src="./links.css">
/* global css*/
a {
text-decoration: none;
}
</style>
<style scoped lang="scss">
/* local css */
</style>
css in js
<script>
// css in js
import "./links.css";
export default {
name: 'links',
}
</script>
<style>
/* @import "./links.css"; */
/* global css */
a {
text-decoration: none;
}
</style>
<style scoped lang="scss">
/* local css */
</style>
$ style src
what fuck tricks ???
https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/Content-Security-Policy/style-src
https://www.w3.org/TR/html401/present/styles.html
https://www.w3schools.com/TAGs/tag_style.asp
https://www.w3schools.com/TAGs/ref_standardattributes.asp
vue components & `@import css` bug的更多相关文章
- webpack4对第三方库css,项目全局css和vue内联css文件提取到单独的文件(二十二)
在讲解提取css之前,我们先看下项目的架构如下结构: ### 目录结构如下: demo1 # 工程名 | |--- dist # 打包后生成的目录文件 | |--- node_modules # 所有 ...
- vue & components & props & methods & callback
vue & components & props & methods & callback demo solution 1 & props & data ...
- ie6,ie7,ie8 css bug兼容解决方法
IE浏览器以不支持大量的css 属性出名,同时也因其支持的css属性中存在大量bug. 这里收集了好多的bug以及其解决的办法,都在这个文章里面记录下来了!希望以后解决类似问题的时候能够快速解决,也希 ...
- Vue过渡效果之CSS过渡
前面的话 Vue 在插入.更新或者移除 DOM 时,提供多种不同方式的应用过渡效果.本文将从CSS过渡transition.CSS动画animation及配合使用第三方CSS动画库(如animate. ...
- vue中引入css文件
两种方式引入css文件,一种是直接在main.js中引入(也可以在其他的.vue文件中的<script></script>标签中),即下面这种写法: import 'eleme ...
- IE下css bug集合-翻译自haslayout.net
概述IE浏览器以不支持大量的css 属性出名,同时也因其支持的css属性中存在大量bug. 本页列举了IE下的一些问题,实例样本和一些我们已知的解决方法. 尽管我已经尽力按照它们本来的性质对它们进行分 ...
- vue使用import来引入组件的注意事项
Vue使用import ... from ...来导入组件,库,变量等.而from后的来源可以是js,vue,json.这个是在webpack.base.conf.js中设置的: module.exp ...
- vue 引入通用 css
1.在入口 js 文件 main.js 中引入,一些公共的样式文件,可以在这里引入. import Vue from 'vue' import App from './App' // 引入App这个组 ...
- vue中的css作用域、vue中的scoped坑点
一.css作用域 之前一直很困扰css的作用域问题,即使是模块化编程下,在对应的模块的js中import css进来,这个css仍然是全局的.导致在css中需要加上对应模块的html的id/class ...
随机推荐
- 在线代码编辑器 Codemirror 的轻量级 React 组件
代码编辑器 CodeMirror 的轻量级 React 组件 demo @uiw-react.github.io/react-codemirror/ 特性:
- CSU1216: 异或最大值(01Trie树)
Description 给定一些数,求这些数中两个数的异或值最大的那个值 Input 多组数据.第一行为数字个数n,1 <= n <= 10 ^ 5.接下来n行每行一个32位有符号非负整数 ...
- Java中堆、栈,静态方法和非静态方法的速度问题
一.堆和栈的速度性能分析 堆和栈是JVM内存模型中的2个重要组成部分,自己很早以前也总结过堆和栈的区别,基本都是从存储内容,存储空间大小,存储速度这几个方面来理解的,但是关于堆和栈的存储 ...
- IDEA的使用方法(二)(代码提示)
工欲善其事必先利其器: 在eclipse用久了代码提示对自己纯手搓代码还是不太好的,我就算是死,从楼上跳下去,也不会从了IDEA的代码提示的,在手搓了一个hello world之后,我写的是JAVA? ...
- 传输控制协议(TCP)
传输控制协议(TCP)[来自Unix网络编程(卷一)第2章] 1.TCP是一个面向连接.可靠性的传输协议: 2.TCP含有用于动态估算客户与服务器之间往返时间(RTT)的算法,以便它知道等待一个确认需 ...
- yii2邮箱发送
yii2 邮件发送 163邮箱 1.在配置文件main-local.php components=>[]里面配置 'mailer' => [ 'class' => 'yii\swi ...
- yii2深入理解之内核解析
一.前言 首先,yii2最为为数不多的PHP主流开源框架,受欢迎程度不亚于laravel和TP.个人认为,研究这些框架底层代码是非常有助于自身代码编程思想的提升和代码简化程度和质量的提升的. 那么,话 ...
- php扩展开发-常量
//常量在内核中的结构 typedef struct _zend_constant { zval value; int flags; char *name; uint name_len; int mo ...
- JavaSE 第二次学习随笔(一)
Java是一种区分大小写的强类型准动态语言 动态语言,是指程序在运行时可以改变其结构:新的函数可以被引进,已有的函数可以被删除等在结构上的变化,类型的检查是在运行时做的,优点为方便阅读,清晰明了,缺点 ...
- POJ:3258-River Hopscotch
River Hopscotch Time Limit: 2000MS Memory Limit: 65536K Total Submissions: 17740 Accepted: 7414 Desc ...