diff --git a/apollo.config.js b/apollo.config.js
index 9873c1d..103dadb 100644
--- a/apollo.config.js
+++ b/apollo.config.js
@@ -1,5 +1,6 @@
 module.exports = {
   client: {
+    includes: ["web/src/**/*.{js,jsx,ts,tsx,vue,gql}"],
     service: {
       name: "ifms-pti-srv",
       url: "http://localhost:4000/graphql",
diff --git a/vetur.config.js b/vetur.config.js
new file mode 100644
index 0000000..4935e13
--- /dev/null
+++ b/vetur.config.js
@@ -0,0 +1,18 @@
+// vetur.config.js
+/** @type {import('vls').VeturConfig} */
+module.exports = {
+  settings: {
+    'vetur.useWorkspaceDependencies': true,
+    'vetur.experimental.templateInterpolationService': true,
+    'vetur.validation.interpolation': false
+  },
+
+  projects: [
+    {
+      root: './web',
+      tsconfig: './tsconfig.json',
+      snippetFolder: './.vscode/vetur/snippets',
+      globalComponents: ['./src/**/*.vue']
+    }
+  ]
+}
diff --git a/web/tsconfig.json b/web/tsconfig.json
new file mode 100644
index 0000000..185682f
--- /dev/null
+++ b/web/tsconfig.json
@@ -0,0 +1,14 @@
+{
+  "include": ["./src/**/*.vue"],
+  "compilerOptions": {
+    // this aligns with Vue's browser support
+    "target": "es5",
+    // this enables stricter inference for data properties on `this`
+    "strict": true,
+    // if using webpack 2+ or rollup, to leverage tree shaking:
+    "module": "es2015",
+    "moduleResolution": "node",
+    "types": ["vue-apollo"]
+  },
+  "exclude": ["node_modules"]
+}