ffp-cli

When writing the project, if the scaffold is not integrated with relevant engineering configuration at the beginning, then if it is integrated, it needs 1. Install dependencies. 2. Modify the configuration file based on the official document. It’s a bit of a hassle, so NODEJS is used to write such a tool, just need to choose to integrate, in one step.

The full name of the front – full – project cli


Provide a complete set of front-end project scaffolding support, by selecting the corresponding configuration directly integrated, eliminating the installation dependency reconfiguration trouble.

The installation

npm i -g ffp-cli
Copy the code

use

1. Select a tool. You can specify the -d parameter or select multiple tools on the cli

ffp // If no parameter is provided, multiple options are selected by default

/ / or
ffp -D jest eslint ts editorConfig commit release travis
// The -d argument supports arrays. If the -d argument is provided, it will not be selected
Copy the code

The renderings are as follows:

2. Add all tools

ffp -a
Copy the code

The effect is as follows:

3. The list of supported tools is displayed

ffp -l
Copy the code

The renderings are as follows:

Tool is introduced

All document addresses are official document addresses.

1. Verify ESLint code

Install esLint dependencies and add esLint configuration files, or overwrite them if they don’t exist locally. If it already exists, the fields are merged without worrying about changing the original configuration.

When plugin: @typescript-esLint /recommended is present in extends, esLint :recommended is deprecated to prevent problems caused by two configuration conflicts.

Document address: eslint.org/docs/user-g…

2. Format the editorConfig editor

(Only recommended. Automatic formatting must be configured by yourself.)

Generate the.editorConfig file. When used with ESLint, the template’s ESLint rules are also merged into the ESLint configuration file.

To format esLint automatically when saving, install the esLint plugin in VScode and write the following to the.vscode.settings.json file in the workspace root directory:

{
  "editor.codeActionsOnSave": {
    "source.fixAll.eslint": true
  }, // Save automatic formatting
}

Copy the code

3. ts

Install typescript dependencies to generate tsconfig.json.

4. Commit Specifies the code submission format

Install dependencies such as’ commitizen ‘, ‘@commitlint/ config-Conventional’, ‘@commitlint/cli’, ‘husky’, ‘Lint-staged’, etc., Add “cz”: “cz” script to package.json. You can use NPM run cz instead of git commit when committing code.

Added pre-commit for NPM test (husky/pre-commit), commit-msg for commitlint

Commitlint Document address: github.com/conventiona…

Husky document address: typicode. Making. IO # / husky / /? Id…

Lint-staged documentation address: github.com/okonet/lint…

5. Automatic publishing of the release specification

Install the standard-version dependency. And add the following objects to package.json (if they already exist, they will not be overwritten, so feel free to use them)

{
  scripts: {
    "release": "standard-version".// Publish locally, change the version number, generate changelog.md according to commit, do not commit the code
    "release:rc": "standard-version --prerelease rc"./ / pre-release
    "pup": "npm run release && git push --follow-tags origin master".// Publish locally and submit remotely
    "pub": "npm run pup && npm publish" // Publish locally and submit to remote, then publish to NPM}}Copy the code

Document address: github.com/conventiona…

6. Jest unit test

Install jest and other related dependencies, and generate jest.config.js related configuration files.

IO/zh-hans /doc…

7. Travis automated CI/CD

Generate the.travis. Yml file. If the related configuration does not meet requirements, you can modify it by yourself.

Document address: docs.travis-ci.com/user/tutori…

The project address

Making: github.com/ma125120/ff…

Gitee: gitee.com/ma125120/ff…

If you need to integrate other tools, you can comment below or make an issue on Github. If you like, click star to support it.