structure-graph-webpack-plugin
A webpack plugin to generate project structure graph
Table of Contents
- Installation
- Usage
- Issues
- License
Installation
npm i --save-dev structure-graph-webpack-plugin
yarn add --dev structure-graph-webpack-plugin
Usage
Here's an example webpack config illustrating how to use this plugin
webpack.config.js
const StructureGraphPlugin = require("structure-graph-webpack-plugin");
{
...
plugins: [
new StructureGraphPlugin()
]
}
Options
You can pass a hash of configuration options to structure-graph-webpack-plugin
.
Allowed values are as follows:
Name | Type | Default | Description |
---|
targetName | {String} | structure.txt | The target file name of the generated directory structure map |
ignoreDirectorys | {Array.<string>} | `` | List of directories ignored in the process of generating files |
ignoreFiles | {Array.<string>} | `` | List of files ignored in the process of generating files |
dress | {String} | dashed | The generated directory structure style, there are two values, dashed and solid |
Here's an example webpack config illustrating how to use these options
webpack.config.js
const StructureGraphPlugin = require("structure-graph-webpack-plugin");
{
...
plugins: [
new StructureGraphPlugin({
targetName: 'structure.md',
ignoreDirectorys: ['.git', 'node_modules'],
ignoreFiles: ['.DS_Store', 'structure.md']
})
]
}
The generated project structure graph:
+-- dream-wall
¦ +-- .gitignore
¦ +-- README.md
¦ +-- build
¦ +-- webpack.base.conf.js
¦ +-- webpack.dev.conf.js
¦ +-- webpack.prod.conf.js
¦ +-- favicon.ico
¦ +-- index.html
¦ +-- package-lock.json
¦ +-- package.json
¦ +-- src
¦ +-- App.vue
¦ +-- components
¦ +-- footer.vue
¦ +-- header.vue
¦ +-- loading.vue
¦ +-- http
¦ +-- index.js
¦ +-- main.js
¦ +-- pages
¦ +-- download.vue
¦ +-- dream.vue
¦ +-- signin.vue
¦ +-- signup.vue
¦ +-- router
¦ +-- index.js
¦ +-- yarn.lock
Issues
If you encounter some problems during use, please click here Issue Report
License
MIT
Copyright (c) 2022-present flyfox