vue webpack多页面构建的实例代码第1/3页

# 下载依赖npm install# 运行npm run devhttp://localhost:3000/login.htmlhttp://localhost:3000/index.html

vue init webpack webpack-multipage // 创建项目cd webpack-multipage // 进入webpack-multipage目录npm install // 下载依赖npm run dev // 运行

|-- src |-- assets |-- components |-- entry  |-- index // index模块   |-- components    |-- Hello.vue   |-- router    |-- index.js   |-- index.html   |-- index.js   |-- index.vue  |-- login // login模块   |-- login.html   |-- login.js   |-- login.vue

# 先下载glob组件npm install glob -D

var glob = require('glob');exports.getEntries = function (globPath) { var entries = {} glob.sync(globPath).forEach(function (entry) { var basename = path.basename(entry, path.extname(entry), 'router.js'); entries[basename] = entry }); return entries;}

module.exports = { entry: utils.getEntries('./src/entry/*/*.js'), ...}

...// https://github.com/ampedandwired/html-webpack-pluginnew HtmlWebpackPlugin({ filename: 'index.html', template: 'index.html', inject: true}),...

var pages = utils.getEntries('./src/entry/*/*.html')for(var page in pages) { // 配置生成的html文件，定义路径等 var conf = { filename: page + '.html', template: pages                        
123下一页阅读全文