uniapp使用命令创建页面

最新推荐文章于 2025-02-13 19:58:09 发布

盏茶作酒

最新推荐文章于 2025-02-13 19:58:09 发布

阅读量2.1k

点赞数

文章标签： uni-app javascript 前端

本文链接：https://blog.youkuaiyun.com/qq_40999917/article/details/132172763

版权

本文介绍了如何在package.json中定义一个命令，通过`addPage.ts`脚本在指定路径下创建新的NVue文件。脚本检查目标路径并自动创建目录和文件，如果文件夹或文件已存在则给出提示。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

package.js下创建命令

"scripts": {
    "add": "node ./auto/addPage.ts"
}

package.js同级目录创建auto/addPage.ts

addPage.ts代码如下

const fs = require('fs')
const path = require('path')
const targetPath = process.argv[2];// 要创建的目录地址和文件名
const args = targetPath.split('/');
const targetParent = args.slice(-2, -1)[0]; //创建路径的父文件夹
const targetName = args.slice(-1)[0]; //创建的文件名
const targetFileName = process.argv[3]; // 要创建的文件中文名
const root = process.argv[4]; // 要创建的文件中文名
let targetFullParentPath, targetFullPath;
if (root) {
  targetFullParentPath = `./src/${root}/` + targetParent; //完整的父文件夹路径
  targetFullPath = `./src/${root}/` + targetPath + '.nvue'; //完整的文件路径
} else {
  targetFullParentPath = './src/pages/' + targetParent; //完整的父文件夹路径
  targetFullPath = './src/pages/' + targetPath + '.nvue'; //完整的文件路径
}

/*检测指定目录下指定文件夹/文件是否存在*/
let isExist = function (path) {
  return fs.existsSync(path);
}

const newPages = {
  name: targetName,
  title: targetFileName,
  path: targetFullParentPath
}

!user_pages.includes(i.name));

// 添加新路由
function addPages(pages) {
  if (isExist(targetFullParentPath) && isExist(targetFullPath)) { //存在文件夹
    console.log("已存在文件夹" + targetParent+ "且存在文件" + targetName)
  } else {
    const { name, title, path } = pages;
    const dirPath = `${path}`;
    if (!isExist(targetFullParentPath)) {
       fs.mkdirSync(dirPath);
    }
    const filePath = `${dirPath}/${name}.nvue`;
    const createStream = fs.createWriteStream(filePath);
    const template = `<script setup lang="ts" ></script>
    <template>
      <view>${title}</view>
    </template>
    <style scoped></style>
    `;
    createStream.write(template);
    createStream.end();
    console.log('\x1B[34m', `pages ${name} created successfully.`);
  }
}

addPages(newPages);

至此就可以愉快的使用命令创建页面啦