diff --git a/.eslintrc b/.eslintrc
new file mode 100644
index 0000000..b9d723c
--- /dev/null
+++ b/.eslintrc
@@ -0,0 +1,8 @@
+{
+  "parserOptions": {
+    "ecmaVersion": 2017
+  },
+  "env": {
+    "es6": true
+  }
+}
\ No newline at end of file
diff --git a/package.json b/package.json
index 7c8c63b..b3edbcb 100644
--- a/package.json
+++ b/package.json
@@ -31,7 +31,9 @@
     "webpack-dev-server": "3.2.1",
     "webpack-inject-plugin": "^1.5.4",
     "eslint": "^7.3.1",
-    "eslint-loader": "^4.0.2"
+    "eslint-loader": "^4.0.2",
+    "typescript": "^4.1.5",
+    "ts-loader": "^8.0.17"
   },
   "devDependencies": {
     "webpack-hot-middleware": "^2.25.0"
diff --git a/src/footer.js b/src/footer.js
index c02648a..cccb5b4 100644
--- a/src/footer.js
+++ b/src/footer.js
@@ -1,7 +1,7 @@
-var parameters = require('cwd/.webpack/parameters.json')
-var main = require('mainFn')
+const parameters = require('cwd/.webpack/parameters.json')
+const main = require('mainFn')
 
-parameters.forEach((entry) => {
+parameters.forEach(entry => {
   console.log(entry)
   main.default(JSON.parse(entry.content))
 })
\ No newline at end of file
diff --git a/start.js b/start.js
index f56cbc7..3c6c727 100644
--- a/start.js
+++ b/start.js
@@ -1,13 +1,12 @@
-let bootstrapper = require('@clavis/lfr-js-portlet-bootstrapper')
-var fs = require('fs')
+const bootstrapper = require('@clavis/lfr-js-portlet-bootstrapper')
+const fs = require('fs')
 
 module.exports = async function (configPath, basePath) {
   await bootstrapper(configPath, basePath)
 
   console.info('Starting Webpack Config')
 
-  let config = getConfig(configPath, basePath)
-
+  const config = getConfig(configPath, basePath)
   const sourcesPath = basePath + config.sources.js
 
   if (!fs.existsSync(sourcesPath)) {
@@ -25,6 +24,7 @@ module.exports = async function (configPath, basePath) {
   }))
   webpackConfig.entry.push(process.cwd() + config.sources.js)
   webpackConfig.resolve.alias.mainFn = sourcesPath
+
   const options = {
     contentBase: sourcesPath + '../',
     hot: true,
@@ -50,7 +50,7 @@ function getConfig (configPath, basePath) {
     configPath = 'liferay.portlet.config.js'
   }
 
-  let fullConfigPath = basePath + '/' + configPath
+  const fullConfigPath = basePath + '/' + configPath
 
   let finalConfig
   const defaultConfig = require(__dirname + '/' + configPath)
diff --git a/tsconfig.json b/tsconfig.json
new file mode 100644
index 0000000..b18e5bc
--- /dev/null
+++ b/tsconfig.json
@@ -0,0 +1,5 @@
+{
+  "compilerOptions": {
+    "allowJs": true
+  }
+}
diff --git a/webpack.config.js b/webpack.config.js
index b64fbf9..89b86f3 100644
--- a/webpack.config.js
+++ b/webpack.config.js
@@ -27,7 +27,7 @@ module.exports = {
       },
       {
         enforce: 'pre',
-        test: /\.(js|vue)$/,
+        test: /\.(ts|js|vue)$/,
         loader: 'eslint-loader',
         exclude: /node_modules/
       },
@@ -36,6 +36,14 @@ module.exports = {
         exclude: /node_modules/,
         use: 'babel-loader'
       },
+      {
+        test: /\.ts?$/,
+        loader: 'ts-loader',
+        exclude: /node_modules/,
+        options: {
+          appendTsSuffixTo: [/\.vue$/]
+        }
+      },
       {
         test: /\.css$/i,
         use: ['style-loader', 'css-loader'],
@@ -68,7 +76,7 @@ module.exports = {
     ]
   },
   resolve: {
-    extensions: ['.js', '.vue'],
+    extensions: ['.js', '.vue', '.ts'],
     alias: {
       cwd: process.cwd(),
     }