new Router({
base: '/project-a/', // 基路径
mode: 'history',
routes: [
{ path: '/', component: Home }
]});
设置基路径后，跟路由相关的所有路径都是相对基路径，而不是根目录。
然后是开发服务器的 资源发布路径 （/config/index.js）：
dev: { assetsPublicPath: '/project-a/' }对应地还要修改「/build/dev-server.js」的两处地方，不然访问的时候就会404：
require('connect-history-api-fallback')({
// 默认为"/index.html"，因为资源发布路径改了，所以这里也要对应上
index: '/project-a/index.html'
})
// 运行项目后默认打开的页面地址
var uri = 'http://localhost:' + port + '/project-a/'最后还要修改 Webpack热更新的检测路径 。先修改「/build/dev-server.js」：
require('webpack-hot-middleware')(compiler, {
log: false,
path: '/project-a/__webpack_hmr'
})然后修改「/build/dev-client.js」：
require('webpack-hot-middleware/client?path=__webpack_hmr&dynamicPublicPath=true&noInfo=true&reload=true')顺带一提，上面的这堆参数完全是用源代码调试的结果，官网文档并没有详细说明。
全部改完之后可以发现，跟目录有关的代码有5处，具体项目使用的时候岂不是要改5次？非常麻烦。这种情况下，把这部分逻辑写成一个公共函数去调用是最好的选择。新建文件「 /src/add-dirname.js 」：
const DIR_NAME = '/project-a/';
module.exports = function(path) {
return (DIR_NAME + path).replace(//{2,}/g, '/');
};然后把刚才涉及添加一级子目录的代码全部改成调用该函数来实现：
这样一来，如果要修改一级子目录，只需要修改常量「DIR_NAME」的值就可以了。
公共代码
我们的公共代码分为三种：
通用性较强的库 ：包括团队成员编写的一些通用库、无法通过npm安装的通用库等，跟业务无关；
业务逻辑库 ：跟业务有关，但是跟表现层无关的公共代码；
业务组件库 ：表现层的组件。
它们都位于「/src/public」：
在每一种公共代码的文件夹内，具体某一个库或者组件的目录结构如下：
/src/public/components/img-box
img-box.vue
1.1
这里要特别提一下的是 版本号 这一层文件夹。如果对库或者组件的修改会造成以前的调用代码不兼容，就不应该修改原文件，而是新建一个版本号文件夹，把新的代码以及其余的资源文件都放到这个新文件夹中。这样做的好处是，具体的项目要更新公共代码时，直接把项目模板的「/src/public」覆盖过去就行，不用担心不兼容。
