webpack3整理(第三节/满三节)------(base.config文件解释)
'use strict'
const path = require('path')
const utils = require('./utils')
const config = require('../config') //想要使用一个插件,你只需要 require() 它,然后把它添加到 plugins 数组中
const vueLoaderConfig = require('./vue-loader.conf') function resolve (dir) {
return path.join(__dirname, '..', dir)
} const createLintingRule = () => ({
test: /\.(js|vue)$/,
loader: 'eslint-loader',
enforce: 'pre', //// 标识应用这些规则,即使规则覆盖(高级选项)
include: [resolve('src'), resolve('test')],
options: {
formatter: require('eslint-friendly-formatter'),
emitWarning: !config.dev.showEslintErrorsInOverlay
}
}) const webapckConfigs = {
//mode: "production", // "production" | "development" | "none"环境切换
context: path.resolve(__dirname, '../'), //// webpack 的主目录
entry: { //entry属性来作为构建其内部依赖图的开始来指定一个入口起点(或多个入口起点)。默认值为 ./src
app: './src/main.js'
},
output: {//output属性告诉 webpack 在哪里输出它所创建的 bundles(包),以及如何命名这些文件,默认值为 ./dist
path: config.build.assetsRoot, //目标输出目录 path 的绝对路径其实就是dist文件夹下面。
filename: '[name].js', //ilename 用于输出文件的文件名。
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'),
}
},
// plugins: [
// new webpack.ProvidePlugin({
// $: 'webpack-zepto'//引入zepto
// })
// new webpack.optimize.UglifyJsPlugin(),
// new HtmlWebpackPlugin({template: './src/index.html'})
// ],
module: {
rules: [
...(config.dev.useEslint ? [createLintingRule()] : []),
{
test: /\.vue$/, //test属性用于标识出应该被对应的 loader 进行转换的某个或某些文件,use 属性,表示进行转换时,应该使用哪个 loader
loader: 'vue-loader',
options: vueLoaderConfig
// test 和 include 具有相同的作用,都是必须匹配选项
// exclude 是必不匹配选项(优先于 test 和 include)
//尽量避免 exclude,更倾向于使用 include,在 include 和 exclude 中使用绝对路径数组
},
{
test: /\.js$/,
loader: 'babel-loader',
include: [resolve('src'), resolve('test'), resolve('node_modules/webpack-dev-server/client')]
},
{
test: /\.(png|jpe?g|gif|svg)(\?.*)?$/,
loader: 'url-loader',
options: {
limit: 10000,
name: utils.assetsPath('img/[name].[hash:7].[ext]')
}
},
{
test: /\.(mp4|webm|ogg|mp3|wav|flac|aac)(\?.*)?$/,
loader: 'url-loader',
options: {
limit: 10000,
name: utils.assetsPath('media/[name].[hash:7].[ext]')
}
},
{
test: /\.(woff2?|eot|ttf|otf)(\?.*)?$/,
loader: 'url-loader',
options: {
limit: 10000,
name: utils.assetsPath('fonts/[name].[hash:7].[ext]')
}
}
]
},
node: {
// prevent webpack from injecting useless setImmediate polyfill because Vue
// source contains it (although only uses it if it's native).
setImmediate: false,
// prevent webpack from injecting mocks to Node native modules
// that does not make sense for the client
dgram: 'empty',
fs: 'empty',
net: 'empty',
tls: 'empty',
child_process: 'empty'
}
} module.exports = webapckConfigs; //导出配置
webpack3整理(第三节/满三节)------(base.config文件解释)的更多相关文章
- 【webpack4.0】---base.config.js基本配置(五)
一.创建项目初始化 1.初始化项目npm init -y 2.创建 src (用来存放开发环境的代码)文件夹. config (用来存放webpack的配置项)文件夹 3.安装webpack We ...
- 在.net中读写config文件的各种方法
阅读目录 开始 config文件 - 自定义配置节点 config文件 - Property config文件 - Element config文件 - CDATA config文件 - Collec ...
- 浅谈config文件的使用
一.缘起 最近做项目开始使用C#,因为以前一直使用的是C++,因此面向对象思想方面的知识还是比较全面的,反而是因没有经过完整.系统的.Net方面知识的系统学习,经常被一些在C#老鸟眼里几乎是常识的小知 ...
- 自定义结构化config文件
前言 开发过程中我们会经常使用到各种config文件,经常我们会使用appSettings进行设置所用的配置,但是随着配置量的增多,都放在appSettings里面明显是不合适的,一方面配置容易混乱, ...
- records.config文件参数解释
# Process Records Config File # # <RECORD-TYPE> <NAME> <TYPE> <VALUE (till end ...
- C# 程序修改config文件后,不重启程序刷新配置ConfigurationManager
基本共识: ConfigurationManager 自带缓存,且不支持 写入. 如果 通过 文本写入方式 修改 配置文件,程序 无法刷新加载 最新配置. PS. Web.config 除外:Web. ...
- WinForm读取指定的config文件的内容
config文件的使用 一.缘起 最近做项目开始使用C#,因为以前一直使用的是C++,因此面向对象思想方面的知识还是比较全面的,反而是因没有经过完整.系统的.Net方面知识的系统学习,经常被一些在C# ...
- 在.net中读写config文件的各种方法(自定义config节点)
http://www.cnblogs.com/fish-li/archive/2011/12/18/2292037.html 阅读目录 开始 config文件 - 自定义配置节点 config文件 - ...
- 在.net中读写config文件的各种方法【转】
今天谈谈在.net中读写config文件的各种方法. 在这篇博客中,我将介绍各种配置文件的读写操作. 由于内容较为直观,因此没有过多的空道理,只有实实在在的演示代码, 目的只为了再现实战开发中的各种场 ...
随机推荐
- Lucene 的四大索引查询 ——bool 域搜索 通配符 范围搜索
Lucene 的四大索引查询 清单1:使用布尔操作符 Java代码 //Test boolean operator blic void testOperator(String indexD ...
- golang defer使用——资源关闭时候多用
defer Go语言中有种不错的设计,即延迟(defer)语句,你可以在函数中添加多个defer语句.当函数执行到最后时,这些defer语句会按照逆序执行,最后该函数返回.特别是当你在进行一些打开资源 ...
- wsdl 生成代码 WCF
具体方法: 打开Microsoft Visual Studio 2008->Visual Studio Tools->Visual Studio 2008 命令提示窗口. 输入:wsdl ...
- js dom element 属性整理(原创)
最近去几家公司面试,发现大多数时候面试的内容考的都是原生的js语法和属性,所以我决心整理一下原生的dom元素的属性. 首先,我我们需要获取一个element元素 <li id="2&q ...
- 转载:SharePoint:扩展DVWP - 第1部分:布局增强 – 在默认值模板和编辑模板中重新排列栏
SharePoint:扩展DVWP - 第1部分:布局增强 – 在默认值模板和编辑模板中重新排列栏 当我们在数据视图中启用编辑,删除模式的链接时,SPD总是将链接添加到左边. 而我本来希望添加到右侧. ...
- 国外、国内各大OJ
下面是几个比较大的在线提交系统(Online Judge)里面有大量历年的竞赛题目,注册一个ID,然后用自己熟悉的语言(一般有Pascal/C/C++/Java)写好源代码提交即可,会实时返 回信息告 ...
- vim 退出命令(保存、放弃保存)
在命令模式中,连按两次大写字母Z,若当前编辑的文件曾被修改过,则Vi保存该文件后退出,返回到shell:若当前编辑的文件没被修改过,则Vi直接退出, 返回到shell. 在末行模式下,输入命令 : ...
- 用文件作为Swap分区
用文件作为Swap分区 1.创建要作为swap分区的文件:增加1GB大小的交换分区,则命令写法如下,其中的count等于想要的块的数量(bs*count=文件大小).# dd if=/dev/zero ...
- Tomcat调整JVM大小,启动闪退
Tomcat因调整过JVM运存大小,导致闪退:解决方法是: -XX:PermSize -XX:MaxPermSize 值调小些就可以了 set "JAVA_OPTS=-server -Xms ...
- 更新gitignore
更新: 2017/04/26 修正windows版本下的命令 git rm -r --cached . (Windows 下的版本) 更新: 2017/06/06 mac下的命令也 ...