let pageMethod = require('./util/getPages.js');
pages = pageMethod.pages();
module.exports = {
pages,
publicPath: "./",//部署应用包时的基本 URL
outputDir: "dist",//运行时生成的生产环境构建文件的目录
assetsDir:"static",//放置生成的静态资源（js,css,img,fonts）的目录
productionSourceMap:false,//生产环境的 source map（打包引用的是js，错误指向map，便于解析）
filenameHashing:false,//生成的静态资源在它们的文件名中包含了 hash 以便更好的控制缓存(public中的静态文件不会加hash)
css: {
modules:true,//只有 *.module.[ext] 结尾的文件才会被视作 CSS Modules 模块
sourceMap:false
},
}
const glob = require('glob')
let pages = {}
module.exports.pages = function (){
//获取pages下匹配路径段中0个或多个任意字符，获取pages目录下的所有js文件
glob.sync( './src/pages/*/*.js').forEach(filepath =>
{
let fileList = filepath.split('/');
let fileName = fileList[fileList.length-2];
pages[fileName] = {
entry: `src/pages/${fileName}/${fileName}.js`,// page 的入口
// 模板来源
template: `src/pages/${fileName}/${fileName}.html`,
// 在 dist/index.html 的输出
filename: process.env.NODE_ENV === 'development'?`${fileName}.html`:`${fileName}.html`,
// 提取出来的通用 chunk 和 vendor chunk。
chunks: ['chunk-vendors', 'chunk-common', fileName]
}
})
return pages
};
<!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,user-scalable=no,minimal-ui,viewport-fit=cover">
<meta content="yes" name="apple-mobile-web-app-capable">
<meta content="black" name="apple-mobile-web-app-status-bar-style">
<meta name="format-detection" content="telephone=no, email=no">
<meta name="W_design" content="750">
<title>xxxx</title>
<script src="./static/base/js/flexible.js"></script>
</head>
<body>
<noscript>
<strong>浏览器版本过低，无法支持此页面，请升级页面；</strong>
</noscript>
<div id="app"></div>
<!-- built files will be auto injected -->
</body>
</html>
import Vue from 'vue'
import App from './index.vue'
Vue.config.productionTip = false
new Vue({
render: h => h(App),
}).$mount('#app')
<template>
<div class="app">
</div>
</template>
<script>
import Pro from "../../components/progress/pro.vue";
export default {
data() {
return {
ssOk: false
};
},
methods: {
},
watch:{},
mounted():{},
components: {
Pro: Pro
}
};
</script>
<style type="text/css" lang="scss" scoped>
</style>