具體思路是通過(guò)將element-ui、vue等常用的包使用外鏈的方式部署
操作如下:
1、修改index.html頁(yè)面,再head中引入cdn。

引入cdn.png
2.修改webpack.base.conf.js文件中的module.exports 添加externals配置:
externals: {
vue: 'Vue',
element: 'ElementUI',
},

注意.png
3.刪除main.js中的相應(yīng)import from。因?yàn)槿绻粍h除,打包的時(shí)候還會(huì)把這兩個(gè)文件打進(jìn)去

打包的時(shí)候刪掉引入.png
更新Vue-cli 3.0 (2019年3月30日):
在Vue-cli 3.0中使用cdn加速的方法:
在根目錄中新建vue.config.js:
'use strict'
const CompressionPlugin = require("compression-webpack-plugin")
const productionGzipExtensions = ['js', 'css'];
const isProduction = process.env.NODE_ENV === 'production';
module.exports = {
publicPath: process.env.NODE_ENV === "production" ? "./" : "/",
outputDir: "../dist",
configureWebpack: config => {
// 開(kāi)啟Gzip壓縮
if (isProduction) {
config.plugins.push(new CompressionPlugin({
algorithm:'gzip',
test: new RegExp('\\.(' + productionGzipExtensions.join('|') + ')$'),
threshold: 10240,
minRatio: 0.8
}))
// 排除掉要使用cdn的包:
config.externals = {
vue: "Vue",
axios: 'axios',
// 這個(gè)地方如果和mian.js一起改為elementUI這種小寫(xiě)的,就會(huì)報(bào)錯(cuò)找不到,原因未知
"element-ui": "ELEMENT"
}
}
},
// 開(kāi)發(fā)服務(wù)器代理轉(zhuǎn)發(fā):
devServer: {
proxy: {
'/api':{
target:'http://localhost:3001/api',
changeOrigin: true,
pathRewrite:{
'/api':''
}
}
}
},
assetsDir: 'static',
indexPath: 'index.ejs',
}
index.html中的內(nèi)容:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width,initial-scale=1.0">
<link rel="icon" href="<%= BASE_URL %>favicon.ico">
<link rel="stylesheet" >
<script src="https://cdn.bootcss.com/vue/2.6.10/vue.min.js"></script>
<script src="https://cdn.bootcss.com/element-ui/2.6.1/index.js"></script>
<script src="https://cdn.bootcss.com/axios/0.18.0/axios.min.js"></script>
<title>個(gè)人小站</title>
</head>
<body>
<noscript>
<strong>We're sorry but fronted doesn't work properly without JavaScript enabled. Please enable it to continue.</strong>
</noscript>
<div id="app"></div>
<!-- built files will be auto injected -->
<!-- <script src="https://unpkg.com/element-ui/lib/index.js"></script> -->
</body>
</html>