使用plop实现自动新建项目文件

为什么

一般项目开发过程中，我们都要编写(CV)一大堆重复性的代码，比如一个views/login/index.vue比如store/modules/app.js这些文件都是重复毫无意义的，找一个自动生成的工具就很有价值了

使用

在github上找到了这样一个包plop，具体信息可以自行去看官方文档，下面直接给出我在项目中使用的

可以看我的这个项目，里面有具体的demofast_h5_vue

1.项目根目录下新建plopfile.js

const viewGenerator = require('./plop-templates/view/prompt')
const componentGenerator = require('./plop-templates/component/prompt')
const storeGenerator = require('./plop-templates/store/prompt.js')

module.exports = function(plop) {
  plop.setGenerator('view', viewGenerator)
  plop.setGenerator('component', componentGenerator)
  plop.setGenerator('store', storeGenerator)
}

这里是三个文件类型分别是view页面，component组件，store vuex文件

2.项目根目录下新建plop-templates文件夹

代码太多，我直接给出文件链接plop-templates

3.新增脚本

在package.json中新增

"script":{
    ...,
    "new":"plop"
}

4.具体使用

控制台直接输入命令

yarn new

按照提示选择文件类型

关于

• 文件代码：https://github.com/ahwgs/fast_h5_vue
• 文章首发于：使用plop实现自动新建项目文件