vue项目中引用公共子模块组件及打包注意事项

一、首先使用submodule指令引入公共组件的子模块

git submodule add https://gitlab.com/b-project（https填项目实际地址）

git add.
git commit -m "add submodule"
git push

然后会自动生成.gitmodules文件

// .gitmodules文件

[submodule "src/cirsComponents"]
	path = src/cirsComponents
	url = git@yfgitlab.dahuatech.com:Software-CD/InfoPub/Cirs/Cirs-Web-Components.git
  branch = master

遇到问题并解决，将问题写入readme文档，供后续开发参考

// 引入组件库，报BrowserslistError: Unknown browser query dead

解决方式一：
删除browserslist相关的配置，在package.json和.babelrc文件都有
这种方式在cirs-web项目中，没有用
解决方式二：
删除cirs-ui组件库，用映射的文件路径代替（消除之前直接对接cirs-ui，而不是映射带来的影响），并重新安装css-loader
这种方式在cirs-web项目中，没有用
解决方式三：
看错误报错，是因为postcss-loader引起的，修改配置
const postcssLoader = {
loader: 'postcss-loader',
options: {
sourceMap: options.sourceMap,
minimize: false  // 增加了这个选项
}
}
这种方式在cirs-web项目中，有用
还有一种解决方式是重装postcss-loader，这种没有尝试。

二、公共子模块组件在项目中按需引用

// .src/register/vue-global/crisComponents.js

/**
 * @description vue全局注册 - 全局cirs组件，按需引入公共子组件
 */

import Vue from 'vue';

import XfDialogPagination from 'cirs-ui/packages/paginationDialog/index';

XfDialogPagination.install(Vue);

// .src/register/vue-global/index.js

import './crisComponents';

// scripts/webpack.base.config.js

alias: {
    'cris-ui': resolve('src/crisCpmponent')
}

// src/entris 入口文件

import '@register/vue-global'

三、修改打包配置文件

// Depend/DependInfo.xml

<?xml version="1.0" encoding="utf-8" ?>
<DependInfo version="1" >
  <Resource name="cirsComponents" url="https://yfgitlab.dahuatech.com/Software-CD/InfoPub/Cirs/Cirs-Web-Components.git" commit_id="HEAD" branch="master" targetfolder="/src/cirsComponents" scm="git" />
</DependInfo>

最后要把node_module文件夹压缩，然后丢入node_modules_zip文件夹，后端打包时会按此压缩文件解析依赖，否则打包无法打包成功。