vue 用别名取代路径引用
在项目开发过程中有可能很多包是没有放在npm上的,许多包需要下载到本地引用,这样一来我们只能通过require的方式来引用文件,但是路径的名字就会很长
例如
import Select from '../../bower_commonents/bootstrap-select/dist/js/select'
这种引用方式违背了CommonJS的编程规范,这些长路径我们可以通过webpack的resolve 配置项来解决。
在weboack.base.config.js中加入以下别名的定义:
module.exports = {
context: path.resolve(__dirname, '../'),
entry: {
app: './src/main.js'
},
output: {
path: config.build.assetsRoot,
filename: '[name].js',
publicPath: process.env.NODE_ENV === 'production'
? config.build.assetsPublicPath
: config.dev.assetsPublicPath
},
resolve: {
extensions: ['.js', '.vue', '.json'],
alias: {
'vue$': 'vue/dist/vue.esm.js',
'@': resolve('src'),
'bs-select': 'bower_components/bootstrap-select/dist/js/selsect.js'
}
}
}
有了上面的这个定义之后,我们就可以把之前的引用改为
import Select from 'bs-select'
vue 用别名取代路径引用的更多相关文章
- vue+webpack静态资源路径引用
处理静态资产 你可能已经注意到,在项目结构中我们有两个静态资产目录:src/assets和static/.他们之间有什么区别? 要回答这个问题,我们首先需要了解Webpack如何处理静态资产.在*.v ...
- vue.js 发布后路径引用问题
在发布到iis目录下时候,如果放在网站的根目录下的时候,是不会有什么问题的 但是一旦放在了非根目录的其他文件夹里面,这时候index.html里引用的js和css文件路径都会找不到 错误如下 打开in ...
- vue项目sql图片动态路径引用问题
最近遇到一个vue动态图片路径的引用问题?明明路径是正确的但是却渲染不出图片!先看我慢慢说来!! 1.当我们把图片的路径放置在data(){return:{}}中的数组中的时候,然后通过v-for循环 ...
- 【vue-cli 3.0】 vue.config.js配置 - 路径别名
如何配置vue-cli 3中vue.config.js的路径别名? 前段时间更新电脑重装了一下vue-cli,发现了vue-cli已经更新到3.0版.用来搭建项目后发现简化了很多,而且配置文件现在可以 ...
- vue打包静态资源路径不正确的解决办法
vue打包静态资源路径不正确的解决办法 vue项目完成打包上线的时候会碰到静态资源找不到的问题,常见的有两个 1.js,css路径不对 解决办法:打开config/index.js,将其中的asset ...
- 用绝对路径引用JS、CSS
项目中,最好使用绝对路径引用JS和CSS文件,详情如下: 1.vm文件中: <link rel="stylesheet" href="$!{request.cont ...
- JavaScript与CSS相对路径引用的差异
转自:http://blog.csdn.net/luohuidong01/article/details/74938652 JS跟CSS相对路径引用的差异在于他们的参考点不一样,下面举个例子说明一下. ...
- 如何在 vue 项目里正确地引用 jquery 和 jquery-ui的插件
copy内容的网址: https://segmentfault.com/a/1190000007020623 使用vue-cli构建的vue项目,webpack的配置文件是分散在很多地方的,而我们需要 ...
- Java引用外部字体(路径引用)的一些坑
一 原因 后端负责字体...哎,我们公司的前端真的任性啊... 然后,一路踩了jvm关于字体的坑,重点是,java的报错很随意,甚至不报错,建议直接看最后面. 二 代码 正常要windows装一次字体 ...
随机推荐
- powershell中使用Send-MailMessage发送邮件
在powershell中我们可以使用Send-MailMessage发送邮件,一般都是有这个命令的 笔者的总结是鉴于公司的环境的,大家在借鉴时,需要根据自己的实际情况进行修改 1.你笔者测试的格式如下 ...
- 趣图:调试bug进行时
扩展阅读 趣图:大神写实,左脚程序继续运行,右脚程序调试 趣图:Bug 多了,总有一个会把你坑了 趣图:领导在旁,只求代码无Bug
- 分布式服务(RPC)+分布式消息队列(MQ)面试题精选
分布式系统(distributed system)是建立在网络之上的软件系统.正是因为软件的特性,所以分布式系统具有高度的内聚性和透明性.因此,网络和分布式系统之间的区别更多的在于高层软件(特别是 ...
- (转)HttpServletResquest对象
HttpServletRequest对象代表客户端的请求,当客户端通过HTTP协议访问服务器时,HTTP请求头中的所有信息都封装在这个对象中,通过这个对象提供的方法,可以获得客户端请求的所有信息. 1 ...
- WEB通信及前后端组成
NDS(域名系统) 按个人的理解,就是将域名和IP映射,通过输入域名,DNS 找到对应的域名的IP地址,即可访问. NDS请求步骤: 当用户输入域名(例:www.baidu.com),回车那一刻: 1 ...
- WPF启动流程-自己手写Main函数
WPF一般默认提供一个MainWindow窗体,并在App.Xaml中使用StartupUri标记启动该窗体.以下通过手写实现WPF的启动. 首先先介绍一下VS默认提供的App.Xaml的结构,如下图 ...
- PuTTY 连接 linux 服务器执行 make menuconfig 乱码问题解决
PuTTY 连接 linux 服务器执行 make menuconfig 时可能出现乱码,如下图所示: 有两个方法解决这个问题: 方法一: 修改 PuTTY 配置如下图所示: 方法二: 在 -/.ba ...
- Centos-bzip2压缩文件-bzip2 bunzip2
bzip2 buzip2 对文件进行压缩与解压缩,类似 gzip gunzip命令,只能压缩文件,对目录则压缩目录下文件,生成以 .bz2为扩展名的文件 相关选项 -d 解压 -v 压缩或解压显示详细 ...
- Python numpy总结(3)——常用函数用法
1,np.ceil(x, y) 限制元素范围,进一法,即向上取整. x 表示输入的数据 y float类型 表示每个元素的上限. a = np.array([-1.7, -1.5, -0.2, 0. ...
- matplotlib绘图教程,设置标签与图例
大家好,欢迎大家阅读周四数据处理专题,我们继续介绍matplotlib作图工具. 在上一篇文章当中我们介绍了matplotlib这个包当中颜色.标记和线条这三种画图的设置,今天我们同样也介绍三种新的设 ...