配置文件代码

var path = require('path')
var webpack = require('webpack')
var glob = require('glob');
复制代码

得到入口文件

// 源文件目录
var sSystem = 'src/';
// src目录如下

每个文件夹下的.js文件都会打包
components文件夹为组件
// 生成多个入口文件

function getEntry() {var entry = {};var nLength = sSystem.length - 1;var srcDirName = './' + sSystem + '/**/*.js';glob.sync(srcDirName).forEach(function (name) {//name:./src/ovdream/basic/member/index/index.jsvar n = name.slice(name.lastIndexOf(sSystem) + nLength, name.length - 3);//n:/member/index/indexentry[n] = name;});return entry;
}
复制代码

exports

module.exports = {entry: getEntry(),output: {path: path.resolve(__dirname, './dist'),publicPath: '/dist/',filename: '[name].js'},module: {rules: [{test: /\.css$/,use: ['vue-style-loader','css-loader'],},{test: /\.vue$/,loader: 'vue-loader',options: {loaders: {// Since sass-loader (weirdly) has SCSS as its default parse mode, we map// the "scss" and "sass" values for the lang attribute to the right configs here.// other preprocessors should work out of the box, no loader config like this necessary.}// other vue-loader options go here}},{test: /\.js$/,loader: 'babel-loader',exclude: /node_modules/},{test: /\.(png|jpg|gif|svg)$/,loader: 'file-loader',options: {name: '[name].[ext]?[hash]'}}]},resolve: {alias: {'vue$': 'vue/dist/vue.esm.js'},extensions: ['*', '.js', '.vue', '.json']},devServer: {historyApiFallback: true,noInfo: true,overlay: true},performance: {hints: false},devtool: '#eval-source-map'
}
if (process.env.NODE_ENV === 'production') {module.exports.devtool = '#source-map'// http://vue-loader.vuejs.org/en/workflow/production.htmlmodule.exports.plugins = (module.exports.plugins || []).concat([new webpack.DefinePlugin({'process.env': {NODE_ENV: '"production"'}}),new webpack.optimize.UglifyJsPlugin({sourceMap: true,compress: {warnings: false}}),new webpack.LoaderOptionsPlugin({minimize: true})])
}
复制代码

vue.js多页面开发 webpack.config.js 配置方式相关推荐

  1. webpack2教程--1webpack的安装和webpack.config.js介绍

    之前都是gulp之类的,现在都什么时代了!是时候学习webpack,现在都webpack4.x了,没办法,我这种弱鸡就只能webpack2开始. webpack官网文件 前提 安装node,安装成功, ...

  2. webpack.config.js 参数详解

    webpack.config.js文件通常放在项目的根目录中,它本身也是一个标准的Commonjs规范的模块. var webpack = require('webpack'); module.exp ...

  3. 拆分js文件_2021入门Webpack,看这篇就够了:Webpack.config.js 解析

    这是优妈成长记的第63篇原创 这是一个webpack配置说明 本文是发布在github上webpack-demo的README文件内容.主要对webpack.config.js每一条的注释说明. gi ...

  4. webpack配置:less/sass文件打包和分离、自动处理css前缀、消除未使用的css及完整的webpack.config.js文件...

    一.less文件打包和分离 1.要使用less,首先使用npm安装less服务:还需要安装Less-loader用来打包使用. npm install less --save-dev npm inst ...

  5. webpack.config.js====插件purifycss-webpack,提炼css文件

    1. 安装:打包编译时,可以删除一些html中没有使用的选择器,如果html页面中没有class=a class="b"的元素,.a{}.b{}样式不会加载 cnpm instal ...

  6. react中webpack.config.js配置lessless-loader less

    这是我第一次配置这些,没有学过webpack,出过很错,还好后来都一一改正.我觉得我遇到的大部分问题就是版本更新了,和老师教的时候用的有一些不一样,但是我想尽量不要去直接将那些包的版本降低,最好还是使 ...

  7. webpack之webpack.config.js配置

    webpack之webpack.config.js配置 wbepack.config.js webpack的配置文件详解: ​ 作用: 指示 webpack 干那些活(当你运行 webpack 指令时 ...

  8. webpack配置文件:webpack.config.js(一)

    1.webpack的配置文件webpack.config.js //const HtmlWebpackPlugin = require('html-webpack-plugin'); module.e ...

  9. webpack.config.js配置遇到Error: Cannot find module '@babel/core'问题

    一. 问题描述 在配置webpack.config.js自动打包的时候,出现Error: Cannot find module '@babel/core'错误 最初以为是babel-core没有安装上 ...

最新文章

  1. Oracle Database 11g的使用
  2. 大学计算机实验vfp,大学计算机基础VFP实验教材26页.doc
  3. 深层高斯过程最新综述:全面阐述高斯过程的核心动机、数学公式和局限性
  4. ipython使用_IPython的介绍与使用
  5. 使用 plsql 时的配置信息(连远程数据库服务器 到 在本机安装 oracle )
  6. 一个程序员必须学会的Github使用技巧
  7. UVa 11481 (计数) Arrange the Numbers
  8. Sting中方法举例
  9. 【技术分享】几维安全CTO刘柏江:IoT时代LLVM编译器防护的艺术
  10. linux系统监控、诊断工具摘录top IO wait lsof
  11. 《计算机应用基础》测试题,《计算机应用基础》测试题(一)
  12. 大学生 计算机 毕业设计 xx管理系统 毕设(1)
  13. 三.卡尔曼滤波器(EKF)开发实践之三: 基于三个传感器的海拔高度数据融合
  14. 聊斋2聂小倩java华语版,[转载]《聊斋志异》2.聂小倩(二)蒲松龄 著  宋德利 译...
  15. pythonweb图书管理系统_部署图书管理系统项目
  16. 理解 假阳性(false positive)和假阴性(false negative)概念
  17. HUAWEI篇 NGFW与AR网关建立GRE over IPSec隧道
  18. 去掉Excel自动弹出的粘贴选项按钮
  19. 为什么说 Compose 的声明式代码最简洁 ?Compose/React/Flutter/SwiftUI 语法对比
  20. 360、搜狗、必应搜索引擎排名规则与SEO优化怎么做?

热门文章

  1. vue怎么实现手风琴效果_Vue中使用v-for制作动态手风琴效果
  2. Tcl Tutorial 笔记3 ·math
  3. cookie和session理解
  4. python关机怎样保存seek_在Python中操作文件之seek()方法的使用教程
  5. html target=_blank 弹出独立窗口,HTML base 标签的 target 属性 —— base target=_blank /...
  6. linux安装python_最基础:如何安装Python?
  7. 批处理定时执行任务_[Abaqus tips ] 分析任务的定时执行
  8. ajax=1,ajax专栏1
  9. mysql读写分离实现_laravel 配置MySQL读写分离
  10. android 辐射动画_Android 四种动画效果的调用实现代码