使用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實現自動新建項目文件