https://github.com/lencx/multipage-template
Multi-module(webpack4, vue2, pug, scss, postcss)
https://github.com/lencx/multipage-template
multi-page postcss pug scss vue2 webpack4
Last synced: 3 months ago
JSON representation
Multi-module(webpack4, vue2, pug, scss, postcss)
- Host: GitHub
- URL: https://github.com/lencx/multipage-template
- Owner: lencx
- Created: 2017-05-31T14:53:16.000Z (about 9 years ago)
- Default Branch: master
- Last Pushed: 2018-09-07T11:09:12.000Z (almost 8 years ago)
- Last Synced: 2025-06-04T22:12:01.709Z (about 1 year ago)
- Topics: multi-page, postcss, pug, scss, vue2, webpack4
- Language: JavaScript
- Homepage:
- Size: 2.02 MB
- Stars: 3
- Watchers: 2
- Forks: 1
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# Multipage Template
```bash
[project]
|- [.bin]
|- [config]
| |- [data]
| | |- alias.json # webpack alias
| | |- mode.json # entry file
| | `- dev-info.json # developer information
| |- webpack.config.js
| `- ...
|- [src]
| |- [models]
| | |- [mode_name] # www | home | app | ...
| | `- ...
| `- [public]
| |- [api]
| | |- dev.api.js
| | |- prod.api.js
| | `- index.js
| |- [components]
| |- [js]
| |- [scss]
| |- [templates]
| | |- [layout]
| | |- [widget]
| | `- ...
| |- [utils]
| `- ...
|- [static]
| |- [plugin]
| |- [lib]
| | |- vue@2.5.17.min.js
| | |- jquery@3.3.1.min.js
| | `- ...
| |- [img]
| |- [media]
| `- ...
|- [webpack]
|- package.json
`- ...
```
## Command
```bash
# install
yarn
yarn dev
yarn build
### help ###
# webpack-cli
yarn cli:help
# webpack-dev-server
yarn dev:help
# default: timestamp
yarn zip
# clear directory
yarn clear # dirname: required
# create mode or page
yarn new mode@ # mode_name: required
# model list
yarn mode
# enable all model
yarn mode all
# `make` command instructions
make
```
## Model
* www
* app
* h5
* ...
## Vue use
### Component
* Global Registration
> path: `/src/public/components`\
> [alias: `@pubcp`](/config/data/alias.json)
```js
// src/public/js/common.js
Vue.component('my-component-name', {
// ... options ...
})
// or
import testBtn from '@pubcp/testBtn.vue'
Vue.component('test-btn', testBtn)
```
* Local Registration
> path: `/src/models/mode_name/components`\
> alias: ...
```js
// src/models/mode_name/js/page_name.js
import localBtn from './your_components_path/localBtn.vue'
new Vue({
el: '#app',
components: {
localBtn
}
})
```
## TODO
* [x] Generate new module or page
* [x] Enable the module through the terminal