在项目开发过程中有可能很多包是没有放在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 用别名取代路径引用的更多相关文章

  1. vue+webpack静态资源路径引用

    处理静态资产 你可能已经注意到,在项目结构中我们有两个静态资产目录:src/assets和static/.他们之间有什么区别? 要回答这个问题,我们首先需要了解Webpack如何处理静态资产.在*.v ...

  2. vue.js 发布后路径引用问题

    在发布到iis目录下时候,如果放在网站的根目录下的时候,是不会有什么问题的 但是一旦放在了非根目录的其他文件夹里面,这时候index.html里引用的js和css文件路径都会找不到 错误如下 打开in ...

  3. vue项目sql图片动态路径引用问题

    最近遇到一个vue动态图片路径的引用问题?明明路径是正确的但是却渲染不出图片!先看我慢慢说来!! 1.当我们把图片的路径放置在data(){return:{}}中的数组中的时候,然后通过v-for循环 ...

  4. 【vue-cli 3.0】 vue.config.js配置 - 路径别名

    如何配置vue-cli 3中vue.config.js的路径别名? 前段时间更新电脑重装了一下vue-cli,发现了vue-cli已经更新到3.0版.用来搭建项目后发现简化了很多,而且配置文件现在可以 ...

  5. vue打包静态资源路径不正确的解决办法

    vue打包静态资源路径不正确的解决办法 vue项目完成打包上线的时候会碰到静态资源找不到的问题,常见的有两个 1.js,css路径不对 解决办法:打开config/index.js,将其中的asset ...

  6. 用绝对路径引用JS、CSS

    项目中,最好使用绝对路径引用JS和CSS文件,详情如下: 1.vm文件中: <link rel="stylesheet" href="$!{request.cont ...

  7. JavaScript与CSS相对路径引用的差异

    转自:http://blog.csdn.net/luohuidong01/article/details/74938652 JS跟CSS相对路径引用的差异在于他们的参考点不一样,下面举个例子说明一下. ...

  8. 如何在 vue 项目里正确地引用 jquery 和 jquery-ui的插件

    copy内容的网址: https://segmentfault.com/a/1190000007020623 使用vue-cli构建的vue项目,webpack的配置文件是分散在很多地方的,而我们需要 ...

  9. Java引用外部字体(路径引用)的一些坑

    一 原因 后端负责字体...哎,我们公司的前端真的任性啊... 然后,一路踩了jvm关于字体的坑,重点是,java的报错很随意,甚至不报错,建议直接看最后面. 二 代码 正常要windows装一次字体 ...

随机推荐

  1. Pandas 中的遍历与并行处理

    使用 pandas 处理数据时,遍历和并行处理是比较常见的操作了本文总结了几种不同样式的操作和并行处理方法. 1. 准备示例数据 import pandas as pd import numpy as ...

  2. 【转】Locust性能-零基础入门系列(1)-wait_time属性用法

    本篇文章,从局部出发,利用一个简单的测试,来说明场景模拟的wait_time属性的用法.wait_time为什么要单独拎出来讲,是因为它主要有两种模式,而初学者对这两种模式,容易混淆.1) wait_ ...

  3. 企业面试中关于MYSQL重点的28道面试题解答

      问题1:char.varchar的区别是什么? varchar是变长而char的长度是固定的.如果你的内容是固定大小的,你会得到更好的性能. 问题2: TRUNCATE和DELETE的区别是什么? ...

  4. Ubuntu修改时区和更新时间

    先查看当前系统时间 root@ubuntu:/# date -R 结果时区是:-0500 我需要的是东八区,这儿显示不是,所以需要设置一个时区 1.运行tzselect root@ubuntu:/# ...

  5. 手撸Mysql原生语句--多表

    在开始之前,我们需要建立表,做建表和数据的准备的工作. 1.建表 create table department( id int, name varchar(20) ); create table e ...

  6. GameObject的==的一个坑和一点GameObject的内部构造

    一切都是因为==,才有了这篇博客 目录 测试 结果和分析 总结 测试 先放一段unity的一个普通的脚本 using UnityEngine; public class UnityEngineObje ...

  7. Centos-当前登录用户信息- w who

    w who 显示当前登录系统的用户,但w显示的更为详细 who 相关参数 # 默认输出 用户名.登录终端.登录时间 -a 列出所有信息 -b    系统最近启动日期 -m   当前终端信息,相当于 w ...

  8. RT Thread SPI设备 使用

    后记: 之前,我把SPI的片选在Cubemx中配置成了SPI_NSS.现在我给它改为了GPIO_OUTPUT.  同时参考了别人的类似的一个操作无线模块(采用SPI设备驱动)的例子程序(清楚了RTT的 ...

  9. Lane-Detection 近期车道线检测论文阅读总结

    近期阅读的几篇关于车道线检测的论文总结. 1. 车道线检测任务需求分析 1.1 问题分析 针对车道线检测任务,需要明确的问题包括: (1)如何对车道线建模,即用什么方式来表示车道线. 从应用的角度来说 ...

  10. Java中 util 包 Calendar类制作万年历(不用自己写方法,直接用Java写好的包中的类的方法)

    代码前需要了解的关于Calendar类的内容:      1.在util包中,首先要知道Calendar 提供了一个类方法 getInstance,以获得此类型的一个通用的对象.Calendar 的 ...