Vue---- vue.config.js 一般配置

声明： 先把用到的写一下，以后还会不断修改

说明： vue-cli3将webpack的基础配置全部内嵌了，统一使用： vue.config.js
当然，也可以单独创建，再引用

主要用来配置项目的运行入口，以及那些文件不被打包等

/* 
 入口文件就是原来的main.js，复制并修改文件名为 main-prod.js 和 main-dev.js
 */

module.exports = {
	chainWebpack: config => {
		//发布模式
		config.when(process.env.NODE_EVN === 'production', config => {
			config.entry('app').clear().add('./src/main-prod.js') //生成环境的打包入口

			//设置不被打包的依赖包（依赖包的变量名要与导入时的相同）
			config.set('externals', {
				vue: 'Vue',
				axios: 'axios',
				echarts: 'echarts',
				nprogress: 'NProgress',
			})
		})

		//开发模式
		config.when(process.env.NODE_EVN === 'development', config => {
			config.entry('app').clear().add('./src/main-dev.js') //开发环境的打包入口
		})
	}
}

注：
里面不被打包的依赖是我用到的，如果用不到不需要添加，当然也可以补充
一般都是体积特别大的包

设置了不被打包的依赖外还需要在public/index.html文件的头部，添加对应的CDN资源引用（css样式和js文件）

<!-- vue -->
<script src="https://cdn.jsdelivr.net/npm/vue"></script>
<!-- axios -->
<script src="https://unpkg.com/axios/dist/axios.min.js"></script>
<!-- echarts -->
<script src="https://cdn.bootcdn.net/ajax/libs/echarts/4.1.0/echarts.min.js"></script>
<!-- nprogress的css与js -->
<link rel="stylesheet" href="https://unpkg.com/nprogress@0.2.0/nprogress.css" />
<script src="https://unpkg.com/nprogress@0.2.0/nprogress.js"></script>