【xingorg1-ui】基于vue3.0从0-1搭建组件库 (二) 库初始化配置

npm地址

github源码

(二) 库初始化

目录结构整理

新建相关文件，整理vue-cli自动建立的目录文件，删除demo文件等

配置文件整理

代码格式化prettier

安装prettier：

npm install -D prettier

新建并配置.prettierrc.json文件：

{
  "singleQuote": true,
  "semi": false,
  "trailingComma": "none"
}

vue.config.js

配置devServer+host

module.exports = {
  publicPath: '/',
  devServer: {
    host: 'dev.xingorg1-ui.com',
    port: 8080,
    disableHostCheck: true
  }
}

别名配置

const path = require('path')
function resolve(filePath) {
  return path.join(__dirname, filePath)
}
module.exports = {
  chainWebpack: config => {
    config.resolve.alias
      .set('packages', resolve('packages'))
      .set('comp', resolve('src/components'))
      .set('style', resolve('styles'))
  }
}

htmlWebpackPlugin配置

安装plugin

npm install -D html-webpack-plugin

暂停配置

导出vue.config配置明细

在项目根目录下，执行下行代码，将vue的默认配置与自己的配置结合导出到outputjs

vue inspect > output.js

撰写README

...