詳解vue-cli多頁面工程實(shí)踐
同時(shí),webpack.dev.conf.js和webpack.prod.conf.js中的HtmlWebpackPlugin刪除。
這時(shí),訪問localhost:8080/和localhost:8080/page1即可看到效果。
vue-router history模式下的多頁面支持
vue-router history模式需要web server支持,這里演示dev環(huán)境下的express支持多頁面的history模式。
build/dev-server.js 在原來require('connect-history-api-fallback')
地方修改:
// handle fallback for HTML5 history API // rewrite的時(shí)候注意 js文件也會(huì)被rewrite let utils = require("./utils"); let history = require('connect-history-api-fallback'); let pages = utils.getEntities("./src/modules/**/index.html"); let rewrites = []; for(let page in pages){ // match: /page/* or /page rewrites.push({from: new RegExp('\/'+page+'\/|^\/'+page+'$'), to: '/'+page+'/index.html'}) } app.use(history({ rewrites: rewrites }));
以上就是本文的全部?jī)?nèi)容,希望對(duì)大家的學(xué)習(xí)有所幫助,也希望大家多多支持腳本之家。
- vue cli 3.x 項(xiàng)目部署到 github pages的方法
- Vue-cli創(chuàng)建項(xiàng)目從單頁面到多頁面的方法
- 詳解vue-cli + webpack 多頁面實(shí)例配置優(yōu)化方法
- vue-cli實(shí)現(xiàn)多頁面多路由的示例代碼
- 詳解如何將 Vue-cli 改造成支持多頁面的 history 模式
- 詳解vue-cli + webpack 多頁面實(shí)例應(yīng)用
- vue-cli創(chuàng)建的項(xiàng)目,配置多頁面的實(shí)現(xiàn)方法
- 基于vue cli重構(gòu)多頁面腳手架過程詳解
- Vue CLI3基礎(chǔ)學(xué)習(xí)之pages構(gòu)建多頁應(yīng)用