Initial commit

Author: Justus Bogner

.editorconfig

@@ -0,0 +1,7 @@
+root = true
+
+[*]
+end_of_line = lf
+insert_final_newline = true
+indent_style = space
+indent_size = 4

.gitignore

@@ -0,0 +1,13 @@
+# git ls-files --others --exclude-from=.git/info/exclude
+# Lines that start with '#' are comments.
+*.settings
+*.classpath
+node_modules
+dist
+build
+target
+npm-debug.log
+.vscode
+typings
+build.log.json
+coverage/

README.md

@@ -1,2 +1,53 @@
-# skeleton-vue-typescript
-A skeleton project with Vue.js, TypeScript, Bootstrap, Less, Webpack, and Jest.
+# Vue.js TypeScript Frontend Skeleton Project
+
+> A skeleton project with Vue.js, TypeScript, Bootstrap, Less, Webpack, and Jest.
+
+## Structure
+
+- `src/app.ts`: main file of the app that loads and configures all dependencies and kickstarts the parent Vue component
+- `src/routes.ts`: configuration of routes (`route`: binding a `component` to a certain `path`)
+- `src/common/`: directory for shared functionality that is not specific to a certain Vue or domain concept
+- `src/components/`: directory for all Vues; should be structured according to domain concepts
+- `src/components/App.vue`: basic app skeleton with header/nav, body, and footer
+- `src/conf/config.ts`: configuration file with app or environment specific properties
+- `test/`: directory for all tests
+
+## Build Setup
+
+``` bash
+# install dependencies
+npm install
+
+# serve locally with hot reload (localhost:9000, adjustable in webpack.dev.config.js)
+npm start
+
+# build for production with minification
+npm run build
+
+# run TypeScript linter
+npm run lint
+
+# run tests and create coverage reports
+npm test
+```
+
+## Useful VSCode Extensions
+
+- Vetur (helps with Vue SFCs)
+- TSLint (enforces coding rules in `tslint.json`)
+- Prettier (formats Vue files)
+- EditorConfig (enforces code formatting in `.editorconfig`)
+
+## VSCode Settings
+
+```json
+{
+    "editor.formatOnSave": true,
+    "prettier.disableLanguages": [
+        "markdown"
+    ],
+    "tslint.alwaysShowRuleFailuresAsWarnings": true,
+    "tslint.autoFixOnSave": true,
+    "vetur.format.defaultFormatter.html": "js-beautify-html"
+}
+```

declarations.d.ts

@@ -0,0 +1,6 @@
+// allows you to `import Foo from "./Foo"` without warnings when Foo is a ".vue" file.
+// this is kinda similar to webpack's `extensions: [".vue"]`, but for TypeScript tooling
+declare module "*.vue" {
+    import Vue from "vue";
+    export default Vue;
+}