SoFunction
Updated on 2025-04-13

Detailed explanation of vue-cli multi-page engineering practice page 2/2

Detailed explanation of vue-cli multi-page engineering practice page 2/2

Updated: August 30, 2017 09:42:00 Author: Shuimujiang
This article mainly introduces the detailed explanation of the multi-page engineering practice of vue-cli. The editor thinks it is quite good. I will share it with you now and give you a reference. Let's take a look with the editor
, inject: true, minify: { removeComments: true, collapseWhitespace: true, removeAttributeQuotes: true // more options: // /kangax/html-minifier#options-quick-reference }, // necessary to consistently work with multiple chunks via CommonsChunkPlugin chunksSortMode: 'dependency', chunks: ['manifest','vendor',page] })); }

Meanwhile, delete the HtmlWebpackPlugin in and.

At this time, visit localhost:8080/ and localhost:8080/page1 to see the effect.

Multi-page support in vue-router history mode

The vue-router history mode requires web server support. Here we demonstrate that express in the dev environment supports multi-page history mode.

build/ in the originalrequire('connect-history-api-fallback')Local modification:

// handle fallback for HTML5 history API
// When rewrite, please note that js files will also be rewrited.let utils = require("./utils");
let history = require('connect-history-api-fallback');
let pages = ("./src/modules/**/");
let rewrites = [];
for(let page in pages){
 // match: /page/* or /page
 ({from: new RegExp('\/'+page+'\/|^\/'+page+'$'), to: '/'+page+'/'})
}
(history({
 rewrites: rewrites
}));

The above is all the content of this article. I hope it will be helpful to everyone's study and I hope everyone will support me more.

Previous page12Read the full text