一.初始化脚手架
创建项目目录
1、初始化脚手架包
1.1 执行如下命令
yarn init
or
npm init
1.2 初始目录接口
新增 bin/cli.js、src/main.ts等文件
y-cli
└─ bin
│ └─ cli.js # node 环境下要运行的脚本
├─ src
│ ├─ constants.ts # 主路口文件
│ └─ main.ts
└─ package.json
src/main.ts
console.log('hello y-cli');
package.json
{
"name": "y-cli",
"version": "1.0.0",
"description": "y-cli",
"main": "index.js",
"bin": {
"y-cli": "./bin/cli.js"
},
"keywords": [],
"repository": {},
"author": "Y_mo",
"license": "MIT"
}
1.3 创建临时连接,实现脚手架命令
执行如下命令:mac 环境有文档访问权限的限制,执行命令前加上 sudo; 例如:sudo yarn link
成功连接:yarn link v1.22.15 success Registered "y-cli". info You can now run yarn link "y-cli" in the projects where you want to use this package and it will be used instead. ✨ Done in 0.03s.
执行脚手架命令
y-cli
遇到的问题
在mac下,执行y-cli后,可能会有如下的情况:
➜ y-cli zsh: permission denied: y-cli
解决方案: sudo chmod -R 777 授权的目录或文件路径
sudo chmod -R 777 /Users/yusunqi/Downloads/plugin-project/y-cli
2、初始化eslint
2.1 安装EsLint
yarn add eslint
or
npm i eslint
2.2 初始化配置文件
npx eslint --init
选择选项完成配置
You can also run this command directly using 'npm init @eslint/config'.
Need to install the following packages:
@eslint/create-config
Ok to proceed? (y) y
✔ How would you like to use ESLint? · style
✔ What type of modules does your project use? · commonjs
✔ Which framework does your project use? · none
✔ Does your project use TypeScript? · No / Yes
✔ Where does your code run? · browser
✔ How would you like to define a style for your project? · guide
✔ Which style guide do you want to follow? · airbnb
✔ What format do you want your config file to be in? · JavaScript
Checking peerDependencies of eslint-config-airbnb-base@latest
Local ESLint installation not found.
The config that you've selected requires the following dependencies:
@typescript-eslint/eslint-plugin@latest eslint-config-airbnb-base@latest eslint@^7.32.0 || ^8.2.0 eslint-plugin-import@^2.25.2 @typescript-eslint/parser@latest
✔ Would you like to install them now? · No / Yes
✔ Which package manager do you want to use? · yarn
到此就完成了第一个阶段的基础的搭建,我们下期见!