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文件的更多相关文章

  1. vue引入外部.css文件，webpack将其与.vue中的样式混合打包了，怎么办？

    我使用vue-cli搭自己的博客,希望引入公共样式: // main.js import './assets/styles/common.css' 我本来是希望webpack打包后,能将这个样式独立打 ...

  2. vue 引入通用 css

    1.在入口 js 文件 main.js 中引入,一些公共的样式文件,可以在这里引入. import Vue from 'vue' import App from './App' // 引入App这个组 ...

  3. webpack4对第三方库css，项目全局css和vue内联css文件提取到单独的文件(二十二)

    在讲解提取css之前,我们先看下项目的架构如下结构: ### 目录结构如下: demo1 # 工程名 | |--- dist # 打包后生成的目录文件 | |--- node_modules # 所有 ...

  4. thymeleaf引入公共css、js

    有时候很多css文件是公共的,我们必须要在每个html文件中引入它们,其实我们可以利用Thymeleaf的模板布局,把这些css文件抽出来,同时如果有某个html文件专属的css文件,还可在引入模板的 ...

  5. vue -- 使用sass并引入公共sass文件

    sass可以提高我们的开发效率,怎么在vue的项目中使用sass并且可以设置一些公共的文件呢? 使用sass 1.安装sass的依赖包 npm install --save-dev sass-load ...

  6. vue2.0引入现有css文件

    1.在vue文件中的<style>内填写需要引用的文件 如: @import "./css/indexTest.css";

  7. springMVC引入js,css文件404

    在web.xml中配置静态资源文件过滤 <!--静态文件引入--> <servlet-mapping> <servlet-name>default</serv ...

  8. Vue引入远程JS文件

    问题 最近在使用 Vue 做东西,用到钉钉扫描登录的功能,这里需要引入远程的 js 文件,因为 Vue 的方式跟之前的不太一样,又不想把文件下载到本地应用,找了一下解决的方法,貌似都需要引入第三方的库 ...

  9. vue引入静态js文件

    由于一些演示,需要对编码名称等可快速进行修改,需要页面方便配置.由于build后的vue项目基本已经看不出原样,因此需要创建一个文件,并在打包的时候不会进行编译. vue-cli 2.0的作法是在st ...

随机推荐

  1. Date与String的相互转换

    构造函数 日期:new Date();//获取当前日期,精确到毫秒. 日期:new Date(long date);//即1970 年 1 月 1 日 00:00:00 GMT(Greenwich M ...

  2. springboot系列（十）springboot整合shiro实现登录认证

    关于shiro的概念和知识本篇不做详细介绍,但是shiro的概念还是需要做做功课的要不无法理解它的运作原理就无法理解使用shiro: 本篇主要讲解如何使用shiro实现登录认证,下篇讲解使用shiro ...

  3. SLAM面试常见问题

    之前我们分享过视觉SLAM找工作.面试经历,见<2018年SLAM.三维视觉方向求职经验分享>,<经验分享 | SLAM.3D vision笔试面试问题>. 从零开始学习SLA ...

  4. oj.zstu 4421交税（合数分解成素数）

    题目 题意:T组,每一组输入一个数X,  求X最少能分成几个素数的和,输出. 思路: 对于一个大于2的偶数,由哥德巴赫猜想,一定能分成2个素数. 对于一个奇数来说,一定能分成2个或者3个素数之和.如果 ...

  5. linux网络编程之socket编程(十二)

    今天继续学习socket编程,期待的APEC会议终于在京召开了,听说昨晚鸟巢那灯火通明,遍地礼花,有点08年奥运会的架势,有种冲动想去瞅见一下习大大的真容,"伟大的祖国,我爱你~~~&quo ...

  6. Android中sp和px之间关系探究

    记得当时在刚接触Android时都在说不要用px,要用sp,所以在实际工作当中当然就按照这个规则,所以都要将px换算成sp,而我在实际工作中的换算规则是dp=px * 1.5,而且用这种规则到现在基本 ...

  7. python访问aws-S3服务

    创建本地 AWS 凭证文件 登录 AWS 管理控制台 并通过以下网址打开 IAM 控制台 https://console.amazonaws.cn/iam/. 创建一个新用户,其权限仅限于您希望您的代 ...

  8. 前端知识总结--html

    1.  doctype的作用是什么? <!DOCTYPE> 声明必须是 HTML 文档的第一行,位于 <html> 标签之前. <!DOCTYPE> 声明不是 HT ...

  9. Git----查看提交日志

    Git log 只包括当前分支的commit. 截图示例: Git reflog 显示整个本地仓储的commit(所有branch,包括已撤销的commit) 截图示例: Git reflog --r ...

  10. java中的finally用法总结

    不管 try 语句块正常结束还是异常结束,finally 语句块是保证要执行的.如果 try 语句块正常结束,那么在 try 语句块中的语句都执行完之后,再执行 finally 语句块.如果 try ...