前端敏捷开发工具整理(自用,持续更新)

715 阅读1分钟

这里整理了一些我自己项目里用到的版本控制、部署等方法和工具,方便自己每次开新坑的时候快速复用,敏捷开发。随着技术能力的提升,会不断优化和完善。

Vue相关(vue-cli 3.0)

正式环境下提取vue

index.html中添加

  <script src="https://cdn.jsdelivr.net/npm/vue@2.6.11"></script>

并在vue.config.js中添加externals

const isProd = process.env.NODE_ENV === 'production'
module.exports = {
    // publicPath: isProd ? './' : '',
    configureWebpack: (config) => {
        config.externals = isProd ? {
            vue: 'Vue',
        } : {}
    }
}

npm相关

自动生成CHANGELOG

通过conventional-changelog-cli自动生成更新日志

$ npm install -g conventional-changelog-cli

## 首次生成
$ conventional-changelog -p angular -i CHANGELOG.md -s -r 0

package.json中结合version使用

{
  "scripts": {
    "version": "conventional-changelog -p angular -i CHANGELOG.md -s && git add CHANGELOG.md",
    "patch": "npm version patch",
    "minor": "npm version minor",
    "major": "npm version major",
  }
}

添加.npmrc自动为生成日志添加commit message

tag-version-prefix=""
message="chore(release): %s "

推荐工作流

  • 提交修改,注意commit message要按规定格式书写
fix(scope): fix bugs 
feat(haha): a new feature
...others
  • 运行patch|minor|major

利用gulp自动提交

todo