vue本地项目静态资源管理

统一放在src/static里面css,images,js

index.html里面使用重置样式

<link rel="stylesheet" href="static/css/reset.css">
 
 

组件里面使用图片 <div><img src="/static/img/img1.jpg"></div>

css使用背景图片
background: url(/static/img/img1.jpg) no-repeat;

npm run build之前需要将config/index.js

assetsPublicPath: '/'     修改成    assetsPublicPath: './'

打包之后网站根目录www里面直接放static目录和index.html

个人建议还是将自定义的css样式和js样式都在main.js中引入，这样纸打包之后生成的是一个文件（已经被整合了）

如果在index.html中引入的话，head里面有多个文件，这样就增加了http请求；

vue本地项目静态资源管理的更多相关文章

  1. vue本地项目设置通过手机访问

    最近再用vue写一个移动端的应用,想通过手机访问看看页面效果,于是有了下文. 1.shif+右键打开命令行工具,输入ipconfig,回车,得到电脑的ip 2.找到工作目录下的config文件夹中的i ...

  2. Vue中的静态资源管理（src下的assets和static文件夹的区别）

    ### 你可能注意到了我们的静态资源共有两个目录src/assets和static/,你们它们之间有怎样的区别呢? 资源打包 为了回答这个问题,我们需要了解webpack是如何处理静态资源的. 在所有 ...

  3. vue 构建项目遇到的请求本地json问题

    在本地测试的json没有问题,但是打包后,发现json 的路径不对了,变成了绝对路径 解决方法: 建立的json文件需要放置  根目录/static下.如项目名/static/data.json,这边 ...

  4. Vue笔记--同局域网下访问本地项目

    正常开发中有时间提测比较麻烦.通常让测试小姐姐连接开发本地开启的服务器访问本地项目(在同一局域网下). 其实一般项目IDE已经实现这些功能例如webstorm和vscode,有时候需要单独配置下. 但 ...

  5. 如何将你的 Vue.js 项目部署在云开发静态托管之上

    云开发静态托管是云开发提供的静态网站托管的能力,静态资源(HTML.CSS.JavaScript.字体等)的分发由腾讯云对象存储 COS 和拥有多个边缘网点的腾讯云 CDN 提供支持. 在云开发静态托 ...

  6. Vuejs实例-01使用vue-cli脚手架搭建Vue.js项目

    [TOC] 1. 前言 vue-cli 一个简单的构建Vue.js项目的命令行界面 整体过程: $ npm install -g vue-cli $ vue init webpack vue-admi ...

  7. ASP.NET没有魔法——ASP.NET MVC界面美化及使用Bundle完成静态资源管理

    对于一个应用来说界面的重要性无言而喻,而Web应用的界面是使用Html+Css以及Javascript实现的,ASP.NET MVC是一个用来构建Web应用的框架,它的界面也是Html实现的,对于一些 ...

  8. vue 构建项目vue-cli

    1.首先得有node和npm的环境,node的下载:http://nodejs.org/download/.安装node之后,npm也自动生成了,显示版本号就意味着安装成功 2.接下来就是安装vue- ...

  9. vue 构建项目遇到的问题

    1.我在打包完成后,打开index.html文件发现地址并没有携带路由. config下的 index.js 中的build命令的配置有一个属性叫assetsPublicPath,它的值为‘/’.意思 ...

随机推荐

  1. XDU 1037 倍流畅序列(字符串匹配+贪心)

    题目描述 对于一个0,1串s, 从左端开始读取它的0获得序列s0,从右端开始读取它的1获得s1,如果s0与s1同构,则称s为倍流畅序列.例如:011001是一个倍流畅序列, 因为:s0 = 0__00 ...

  2. Python的幂运算

    直接用例子说明

  3. JSON 转 对象

    Json对象与Json字符串的转化.JSON字符串与Java对象的转换   一.Json对象与Json字符串的转化 1.jQuery插件支持的转换方式: $.parseJSON( jsonstr ); ...

  4. Web Servlet的体系架构

    Servlet为根接口,里面有5个方法,init() servlet初始化,将ServletConfig作为参数传入,service() 响应请求,destroy() 销毁servlet,getSer ...

  5. HTTP服务器(3)

    功能完整的HTTP服务器 导语 这个一个功能完备的HTTP服务器.它可以提供一个完整的文档输,包括图像,applet,HTML文件,文本文件.它与SingleFileHttpServer非常相似,只不 ...

  6. JS答辩习题

    php高中班javascript答辩题目 1 什么是javascript?  答:Javascript是一种专门设计用来增强网页交互性的脚本语言,它也是一种解释型语言. 2 Javascript与C语 ...

  7. DevOps实践之持续集成Jenkins（最新版本测试）

    一.安装Jenkins (1)下载并安装配置Java Development Kit 8 [root@localhost ~]# rpm -ivh jdk-8u161-linux-x64.rpm Pr ...

  8. MVC中一个Form多个submit在controller中如何区分提交的是那个submit(如：登陆和注册)

    1. 用Html.BeginForm(ActionName,ControllerName,Post)来实现controller-action的路由, 2. Form里的每个input的name值统一, ...

  9. 20145216史婧瑶《Java程序设计》第3周学习总结

    20145216 <Java程序设计>第3周学习总结 教材学习内容总结 第四章 认识对象 4.1 类与对象 •对象(Object):存在的具体实体,具有明确的状态和行为 •类(Class) ...

  10. 20145321 《Java程序设计》第5周学习总结

    20145321 <Java程序设计>第5周学习总结 教材学习内容总结 第八章 1.Try.catch:Java中所有错误都会被打包为对象,通过try和catch语法可以对代表错误的对象做 ...