jsc-ui

jsc-ui 组件库

1. 将 src 文件夹命名为 examples 文件 演示组件是否可行

修改vue.config.js 文件

const path = require('path');
function resolve (dir) {
  return path.join(__dirname, dir);
}

module.exports = {
  devServer: {
    compress: true,
    port: 2020
  },
  pages: { // 将 examples 目录添加为新的页面
    index: {
      entry: 'examples/main.js', // page 的入口
      template: 'public/index.html', // 模板来源
      filename: 'index.html' // 输出文件名
    }
  },
  publicPath: './',
  chainWebpack: config => {
    config.resolve.alias
      .set('packages', resolve('packages'))
      .set('@', resolve('examples'));
  }
};

2. 新建 packages 文件夹在这里新建组件

同时新建 index.js 将组件引入

import PopupText from "./PopupText";
export default PopupText

3. 修改 package.json

  "scripts": {
    "start": "npm run serve",
    "serve": "vue-cli-service serve",
    "build": "vue-cli-service build",
    "lib": "vue-cli-service build --target lib --inline-vue --name jsc-ui packages/index.js --dest lib",
    "lint": "vue-cli-service lint"
  }

4. 新增 .npmignore 文件

.DS_Store
node_modules/
dist/
examples/
public/
packages/
tests/
vue.config.js
babel.config.js
*.map
*.html

# local env files
.env.local
.env.*.local

# Log files
npm-debug.log*
yarn-debug.log*
yarn-error.log*

# Editor directories and files
.idea
.vscode
*.suo
*.ntvs*
*.njsproj
*.sln
*.sw*

5. npm run serve 看组件是否正确

6. npm run lib 压缩组件

7. package.json 文件填写压缩好的文件入口

  "main":"lib/jsc-ui.umd.min.js"

8. 将压缩好的组件上传npm