[Vue]webpack的require与require.context
1.require
1.1完整路径的require语句:
require('tools'); //preset alias tools
require('./js/main');
1.2带表达式的 require 语句:自动创建一个上下文(context)
如果你的 require参数含有表达式(expressions),会自动创建一个上下文(context),因为在编译时(compile time)并不清楚具体是哪一个模块被导入。
如:
require('./template/' + name + '.ejs');
webpack 解析 require() 的调用,提取出来如下这些信息:
Directory: ./template
Regular expression: /^.*\.ejs$/
会返回template目录下的所有后缀为.ejs模块的引用,包含子目录:
{
"./table.ejs": 42,
"./table-row.ejs": 43,
"./directory/folder.ejs": 44
}
2.require.context:手动创建一个上下文(context)
require.context(directory, useSubdirectories = false, regExp = /^\.\//);
directory:指定要打包的目录;
useSubdirectories :是否搜寻子目录;
regExp :匹配的正则 例:
require.context("./test", false, /\.test\.js$/);
//(创建了)一个包含了 test 文件夹(不包含子目录)下面的、所有文件名以 `.test.js` 结尾的、能被 require 请求到的文件的上下文。
详情参照官网:https://webpack.docschina.org/guides/dependency-management/#带表达式的-require-语句
[Vue]webpack的require与require.context的更多相关文章
- 一字一句的搞懂vue-cli之vue webpack template配置
webpack--神一样的存在.无论写了多少次,再次相见,仍是初见.有的时候开发vue项目,对尤大的vue-cli感激涕零.但是,但是,但是...不是自己的东西,真的很不想折腾.所以,我们就得深入内部 ...
- 【原创】从零开始搭建Electron+Vue+Webpack项目框架,一套代码,同时构建客户端、web端(二)
摘要:上篇文章说到了如何新建工程,并启动一个最简单的Electron应用.“跑起来”了Electron,那就接着把Vue“跑起来”吧.有一点需要说明的是,webpack是贯穿这个系列始终的,我也是本着 ...
- Vue + Webpack + Vue-loader 系列教程(1)功能介绍篇
原文地址:https://lvyongbo.gitbooks.io/vue-loader/content/ Vue-loader 是什么? vue-loader 是一个加载器,能把如下格式的 Vue ...
- Vue + Webpack + Vue-loader 1
Vue + Webpack + Vue-loader 原文地址:https://lvyongbo.gitbooks.io/vue-loader/content/ Vue-loader 是什么? vue ...
- 从零开始:一个正式的vue+webpack项目的目录结构是怎么形成的
如何从零开始一个vue+webpack前端工程工作流的搭建,首先我们先从项目的目录结构入手.一个持续可发展,不断加入新功能,方便后期维护的目录结构究竟是长什么样子的?接下来闰土大叔带你们一起手摸手学起 ...
- Vue + webpack 项目实践
Vue.js 是一款极简的 mvvm 框架,如果让我用一个词来形容它,就是 “轻·巧” .如果用一句话来描述它,它能够集众多优秀逐流的前端框架之大成,但同时保持简单易用.废话不多说,来看几个例子: & ...
- nodejs, vue, webpack 项目实践
vue 及 webpack,均不需要与nodejs一期使用,他们都可以单独使用到任何语言的框架中. http://jiongks.name/blog/just-vue/ https://cn.vuej ...
- 从0开始搭建vue+webpack脚手架(三)
在从0开始搭建vue+webpack脚手架(二)中已经基本完成了开发环境的配置.当开发完成后,我们需要将完成的项目进行打包,接下来对打包做一些优化: 运行 $ npm run build 可生成dis ...
- 从0开始搭建vue+webpack脚手架(二)
接着从0开始搭建vue+webpack脚手架(一) 三.配置webpack-dev-server 1. webpack-dev-server自带一个node的服务器, 项目在服务端运行的同时可以实现热 ...
- vue+webpack开发(一)
一开始接触这个vue+webpack的时候,实在是摸不着头脑,根本无从下手. 但是经过这两天的研究,其实你会发现vue其实并不难,难度都在webpack你对webpack的理解. webpack顾名思 ...
随机推荐
- MongoDB主从复制+集群
一.读写分离的概念 读写分离,基本的原理是让主数据库处理事务性增.改.删操作(INSERT.UPDATE.DELETE),而从数据库处理SELECT查询操作.数据库复制被用来把事务性操作导致的变更同步 ...
- lua全局状态机
本文内容基于版本:Lua 5.3.0 global_State概述 global_State结构,我们可以称之为Lua全局状态机.从Lua的使用者角度来看,global_State结构是完全感知不到的 ...
- 使用LocationManager来获取移动设备所在的地理位置信息
在Android应用程序中,可以使用LocationManager来获取移动设备所在的地理位置信息.看如下实例:新建android应用程序TestLocation. 1.activity_main.x ...
- CentOS 6.5上安装python2.7、pip以及Python命令行补全和yum冲突解决
目前CentOS6.5上自带的python版本为2.6,升级到python2.7会碰到很多问题.本文将介绍如何安装python2.7.pip以及python命令行补全. 一.如何安装python2.7 ...
- Salesforce中Html的转义,InputField和RemoteAction
在Salesforce的开发中,有时候需要在对象中插入记录,其中有的字段需要插入Html,但是对于输入Html的域,大多数框架和网站都需要做Html的转义处理,防止XSS或者SQL注入攻击.有时候我们 ...
- 常用RDD
只作为我个人笔记,没有过多解释 Transfor map filter filter之后,依然有三个分区,第二个分区为空,但不会消失 flatMap reduceByKey groupByKey() ...
- $如何用Python装饰器实现一个代码计时器?
有时候我们很希望看到程序中某个函数或某个代码段的耗时情况,那么该如何办呢?本文用两种方式实现了代码计时器的功能,第一种方式是采用装饰器来实现,第二种方式采用上下文管理器实现. 其实计算代码的运行时间, ...
- 在vi中打开多个文件,复制一个文件中多行到另一个文件中
:set number 查看行号1.vi a.txt b.txt或者vi *.txt 2.文件间切换 :n切换到下一个文件,:wn保存再切换 :N到上一个文件,:wN保存再切换 :.=看当前行 3.比 ...
- mongodb研究(mongodb 内存数据库)
本日志大部分都不是原创的转载复制的会带链接保持版权 工作中使用mongodb已经好久了,讽刺的是到了最后快离职的时候才有时间好好研究下源码. 印象:mongodb是一个内存数据库,数据都是放到内存 ...
- kali安装机场v2ray客户端
为了方便查找资料,之前安装的ssr在kali上面,感觉速度不怎么快,相比windows和android上慢很多,所以打算在kali上面装个机场试试,看官方介绍说机场比ssr速度更快,下面是安装步骤: ...