uniapp使用npm命令自动新建页面
#适用场景:项目内新建页面需要新建很多文件,编写自动化脚本一键创建需要的文件及模板内容
#以uniapp模板项目为例
#个人学习记录,新手新手新手,不严谨的地方还请指正,感谢感谢
1、新建uniapp项目
2、在根目录打开终端,进行npm初始操作
npm init
npm install
3、目录结构如下:
4、自己定义执行命令
#我命令采用的是如下格式:
#npm run create login/login 登录页
#npm run 自定义命令名 文件夹名/文件名 文件中文名
在package.json中添加以下命令:
"scripts": {
"create": "node ./bin/create/index" //create是自定义的命令名,create事件是 执行bin/create文件夹下的index.js文件
},
5、模板编写
less模板是空文件,vue就是通用格式,若要定制内容需自己改写
6、执行文件index.js
#以下以命令 "npm run create login/login 登录页"为例
##定义部分常量
##函数 - 判断是否已存在文件/文件夹
##函数 - 获取vue、less模板内容
##函数 - 创建文件夹/文件
##最后在index.js末端,执行创建
注意:执行顺序自上而下,确保函数位置正确
只做了简单的示例,还有部分操作没写(路由、文件中文名title的配置等)