vue: 'Vue',
'vue-router': 'VueRouter',
vuex: 'Vuex',
'mint-ui': 'MINT',
axios: 'axios'
}
const cdn = {
// 开发环境
dev: {
css: [
'https://lib.baomitu.com/mint-ui/2.2.13/style.min.css'
],
js: [] },
// 生产环境
build: {
css: [
'https://lib.baomitu.com/mint-ui/2.2.13/style.min.css'
],
js: [
'https://lib.baomitu.com/vue/2.6.6/vue.min.js',
'https://lib.baomitu.com/vue-router/3.0.1/vue-router.min.js',
'https://lib.baomitu.com/vuex/3.0.1/vuex.min.js',
'https://lib.baomitu.com/axios/0.18.0/axios.min.js',
'https://lib.baomitu.com/mint-ui/2.2.13/index.js'
] }
}
configureWebpack: config => {
if (isProduction) {
// externals里的模块不打包
Object.assign(config, {
externals: externals
})
} else {
// 为开发环境修改配置...
}
},
chainWebpack: config => {
// 对vue-cli内部的 webpack 配置进行更细粒度的修改。
// 添加CDN参数到htmlWebpackPlugin配置中， 详见public/index.html 修改
config.plugin('html').tap(args => {
if (process.env.NODE_ENV === 'production') {
args[0].cdn = cdn.build
}
if (process.env.NODE_ENV === 'development') {
args[0].cdn = cdn.dev
}
return args
})
}
<!DOCTYPE html>
<html lang="en"><head>
<meta charset="utf-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<!-- DNS预解析 -->
<link rel="dns-prefetch" href="//lib.baomitu.com" />
<meta name="viewport"
content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=0,minimal-ui,viewport-fit=cover" />
<link rel="icon" href="<%= BASE_URL %>favicon.ico" />
<!-- 使用CDN加速的CSS文件，配置在vue.config.js下 -->
<% for (var i in
htmlWebpackPlugin.options.cdn&&htmlWebpackPlugin.options.cdn.css) { %>
<link href="<%= htmlWebpackPlugin.options.cdn.css[i] %>" rel="preload" as="style" />
<link href="<%= htmlWebpackPlugin.options.cdn.css[i] %>" rel="stylesheet" />
<% } %>
<title>vuedemo</title>
</head>
<body>
<noscript>
<strong>We're sorry but vuedemo doesn't work properly without JavaScript
enabled. Please enable it to continue.</strong>
</noscript>
<div id="app"></div>
<!-- 使用CDN加速的JS文件，配置在vue.config.js下 -->
<% for (var i in
htmlWebpackPlugin.options.cdn&&htmlWebpackPlugin.options.cdn.js) { %>
<script src="<%= htmlWebpackPlugin.options.cdn.js[i] %>"></script>
