vue 引入公共css文件
1、在入口js文件main.js中引入,一些公共的样式文件,可以在这里引入。
import Vue from 'vue'
import App from './App' // 引入App这个组件
import router from './router' /* 引入路由配置 */
import axios from 'axios'
import '../static/css/global.css' /*引入公共样式*/
2、在index.html中引入
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>stop</title>
<link rel="stylesheet" href="./static/css/global.css"> /*引入公共样式*/
</head>
<body>
<div id="app"></div>
<!-- built files will be auto injected -->
</body>
</html>
3、在app.vue中引入,但是这样引入有一个问题,就是在index.html的HEADH上会多出一个空的<style></style>
<template>
<div id="app">
<router-view/>
</div>
</template>
<script>
export default {
name: 'app'
}
</script>
<style>
@import './../static/css/global.css'; /*引入公共样式*/
</style>
vue 引入公共css文件的更多相关文章
- vue引入外部.css文件,webpack将其与.vue中的样式混合打包了,怎么办?
我使用vue-cli搭自己的博客,希望引入公共样式: // main.js import './assets/styles/common.css' 我本来是希望webpack打包后,能将这个样式独立打 ...
- vue 引入通用 css
1.在入口 js 文件 main.js 中引入,一些公共的样式文件,可以在这里引入. import Vue from 'vue' import App from './App' // 引入App这个组 ...
- webpack4对第三方库css,项目全局css和vue内联css文件提取到单独的文件(二十二)
在讲解提取css之前,我们先看下项目的架构如下结构: ### 目录结构如下: demo1 # 工程名 | |--- dist # 打包后生成的目录文件 | |--- node_modules # 所有 ...
- thymeleaf引入公共css、js
有时候很多css文件是公共的,我们必须要在每个html文件中引入它们,其实我们可以利用Thymeleaf的模板布局,把这些css文件抽出来,同时如果有某个html文件专属的css文件,还可在引入模板的 ...
- vue -- 使用sass并引入公共sass文件
sass可以提高我们的开发效率,怎么在vue的项目中使用sass并且可以设置一些公共的文件呢? 使用sass 1.安装sass的依赖包 npm install --save-dev sass-load ...
- vue2.0引入现有css文件
1.在vue文件中的<style>内填写需要引用的文件 如: @import "./css/indexTest.css";
- springMVC引入js,css文件404
在web.xml中配置静态资源文件过滤 <!--静态文件引入--> <servlet-mapping> <servlet-name>default</serv ...
- Vue引入远程JS文件
问题 最近在使用 Vue 做东西,用到钉钉扫描登录的功能,这里需要引入远程的 js 文件,因为 Vue 的方式跟之前的不太一样,又不想把文件下载到本地应用,找了一下解决的方法,貌似都需要引入第三方的库 ...
- vue引入静态js文件
由于一些演示,需要对编码名称等可快速进行修改,需要页面方便配置.由于build后的vue项目基本已经看不出原样,因此需要创建一个文件,并在打包的时候不会进行编译. vue-cli 2.0的作法是在st ...
随机推荐
- http协议工作原理(精简)
HTTP协议进行通信时,需要有客户端(即终端用户)和服务端(即Web服务器),在Web客户端向Web服务器发送请求报文之前,先要通过TCP/IP协议在Web客户端和服务器之间建立一个TCP/IP连接 ...
- 2. 软件有很多种,也有各种分类办法: ShrinkWrap (在包装盒子里面的软件,软件在CD/DVD上); Web APP (基于网页的软件); Internal Software (企业或学校或某组织内部的软件); Games (游戏); Mobile Apps (手机应用); Operating Systems (操作系统); Tools
选取对你最相关的一类软件, 请回答:(web app) 1) 此类软件是什么时候开始出现的, 这些软件是怎么说服你(陌生人)成为他们的用户的? 他们的目标都是盈利么? 他们的目标都是赚取用户 ...
- MyBatis 3.0_[tp-24-25]_映射文件_参数处理_#与$取值区别_#{}更丰富的用法
笔记要点出错分析与总结 /**================Mybatis参数值的获取:#和$符号的区别=============== * #{}:可以获得map中的值或者pojo对象属性的值; * ...
- P1338 末日的传说[水题]
题目描述 只要是参加jsoi活动的同学一定都听说过Hanoi塔的传说:三根柱子上的金片每天被移动一次,当所有的金片都被移完之后,世界末日也就随之降临了. 在古老东方的幻想乡,人们都采用一种奇特的方式记 ...
- JavaScript003,用法
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title> ...
- 前端面试:Vue.js常见的问题
摘自今日头条用户:代码开发 原文链接: https://www.toutiao.com/a6683120112255369732/?tt_from=mobile_qq&utm_campaign ...
- bootstrap最简单的导航条
<nav class="navbar navbar-default navbar-static-top"> <div class="navbar-hea ...
- Define Interfaces and Share Class Members through Mixins in Dart
In this lesson, we will cover Interfaces and Mixins. Interfaces act as a contract containing propert ...
- 关于 $.proxy(fn,context,arg) 方法
<!-- $.proxy(fn,this,agrument); proxy 代理 思考做酒的代理商argument就是代理商 把fn所在的作用域对象的参数/属性 代理给fn执行. fn: 要被调 ...
- / WebAPP开发与小程序 / 步骤一 · 4-5 地图搜索与poi结合(2)
/ WebAPP开发与小程序 / 步骤一 · 4-5 地图搜索与poi结合(2) 在地图中搜索指定对象时,搜索结果可以显示出每个对象的图片,就差这个不会了