Seed-inventory NPM

faste-lite-framework

This code framework represents a collaboration between Team 301 and Team Supernova to utilize the the faste-lite functionality within the modular framework approach.

For more information about the faste-lite approach, please reach out to Team Supernova and/or review their documentation, found here.

Framework

Based on multiple iterations with the previous framework version, we have developed an approach to specifically solve the challenges we faced with the initial framework. In the migration to the faste-lite framework, we eliminated our dependency on webpack and shifted to parcel. Further research and testing is needed to best utilize parcel's code-splitting and optimization. This move did solve a few critical requirements for us that were previously outstanding, specifically:

Internal route management
i18n functionality
Further decouples our dependency on the c7-element version vs. the latest Element version.

Structural updates

We did modify our base module framework slightly to make it more easily understandable and universal. With few exceptions these structures are largely optional, so use only the ones you need.

:file_folder: Feature Name - Replace with ACTUAL feature name | - :file_folder: src - Top-level folder for all source code | | - :file_folder: assets - Stylesheets, shared code, etc. | | | - :page_facing_up: i18n.ts - Internationalization support | | | - :page_facing_up: router.ts - Internal routing management | | | - :page_facing_up: store.ts - Internal store management | | - :file_folder: components - Feature specific, purpose-built Vue components | | - :file_folder: configs - Specific table configuration information | | - :file_folder: locales - i18n translation files | | - :file_folder: views - Feature specific landing pages, as defined by internal router | | | - :page_facing_up: dashboard.vue - Landing page for use with widgets/cards | | | - :page_facing_up: table.vue - Landing page for use with table components | | - :file_folder: widgets - Feature specific cards to populate the dashboard view | | - :page_facing_up: app.vue - Default application entry point | | - :page_facing_up: faste.ts - Entry point for building the feature into the accepted bundle | | - :page_facing_up: index.html - Required for localhost testing | | - :page_facing_up: shims-modules.d.ts - Module definitions for TypeScript support | | - :page_facing_up: shims-tsx.d.ts - Required for using TypeScript within SFC | - :page_facing_up: .babelrc - Required by Parcel | - :page_facing_up: .env - Build environment management settings | - :page_facing_up: .gitignore | - :page_facing_up: package-lock.json | - :page_facing_up: package.json | - :page_facing_up: prettier.config.js | - :page_facing_up: README.md | - :page_facing_up: tsconfig.json - TypeScript build/evaluation rules | - :page_facing_up: tslint.json | - :page_facing_up: vue.config.js - Vue build rules

Project scripts

Project setup

npm run setup
npm i && npm ddp

Project cleanup

Clean project and rebuild dependencies npm run clean
npm run clean:dist && npm run clean:modules && npm run setup
Clean out dist folder npm run clean:dist
rm -Rf ./dist
Clear out installed modules npm run clean:modules
rm -Rf ./node_modules && rm package-lock.json

Code cleanup

Run prettier and report npm run prettier
prettier -c --config ./prettier.config.js src/**/*.[jt]s && prettier -c --config ./prettier.config.js src/**/*.vue
Run prettier and fix formatting npm run prettier:fix
prettier -c --config ./prettier.config.js --write src/**/*.[jt]s && prettier -c --config ./prettier.config.js --write src/**/*.vue
Run lint and report npm run lint
tslint -p .
Run lint and fix issues automatically - MAY NOT WORK FOR ALL ISSUES npm run lint
tslint --fix -p .
Run both lint & prettier and report issues npm run format:report
npm run lint && npm run prettier
Run both lint & prettier and report issues npm run format:fix
npm run prettier:fix && npm run lint:fix

Project testing

Localhost testing npm start
parcel src/index.html --target browser --bundle-node-modules --no-source-maps -p 8080 --open
Unit testing npm run test:unit
vue-cli-service test:unit
i18n usage reporting npm run i18n:report
vue-cli-service i18n:report --src './src/**/*.?(ts|vue)' --locales './src/locales/**/*.json'

Build faste-lite module for deployment

npm run build:prod

parcel build src/faste.ts --target browser --bundle-node-modules --detailed-report 30 --no-source-maps --no-content-hash --out-file bundle.js