From 9ec309c29999c8cb20f7eacc051d52f946e42dfb Mon Sep 17 00:00:00 2001 From: David Paz Date: Sun, 9 Jul 2017 11:22:30 +0200 Subject: [PATCH 1/3] Add typescript loader documentation --- frontend/encore/typescript.rst | 46 ++++++++++++++++++++++++++++++++++ 1 file changed, 46 insertions(+) create mode 100644 frontend/encore/typescript.rst diff --git a/frontend/encore/typescript.rst b/frontend/encore/typescript.rst new file mode 100644 index 00000000000..9298c7aa7a1 --- /dev/null +++ b/frontend/encore/typescript.rst @@ -0,0 +1,46 @@ +Enabling TypeScript (ts-loader) +=============================== + +Want to use `TypeScript`_? No problem! First, install the dependencies: + +.. code-block:: terminal + + $ yarn add --dev typescript ts-loader + +Then, activate the ``ts-loader`` in ``webpack.config.js``: + +.. code-block:: diff + + // webpack.config.js + // ... + + Encore + // ... + .addEntry('main', './assets/main.ts') + + .enableTypeScriptLoader() + ; + +That's it! Any ``.ts`` files that you require will be processed correctly. You can +also configure the `ts-loader options`_ via a callback: + +.. code-block:: javascript + + .enableTypeScriptLoader(function (typeScriptConfigOptions) { + typeScriptConfigOptions.transpileOnly = true; + typeScriptConfigOptions.configFileName = '/path/to/tsconfig.json'; + }); + +If React assets are enabled: `enableReactPreset()`, any ``.tsx`` file will be +processed as well by ``ts-loader``. + +Loader usage can be checked better in its `README`_ documentation. + + "Use webpack like normal, including ``webpack --watch`` and ``webpack-dev-server``, + or through another build system using the Node.js API." + + -- Running section of ts-loader documentation + +.. _`TypeScript`: https://www.typescriptlang.org/ +.. _`ts-loader options`: https://github.com/TypeStrong/ts-loader#options +.. _`README`: https://github.com/TypeStrong/ts-loader#typescript-loader-for-webpack \ No newline at end of file From 011e0d048881704cfeb425021e16d2e07445eef0 Mon Sep 17 00:00:00 2001 From: David Paz Date: Sun, 9 Jul 2017 11:38:29 +0200 Subject: [PATCH 2/3] Add reference to docs in frontend page --- frontend.rst | 1 + 1 file changed, 1 insertion(+) diff --git a/frontend.rst b/frontend.rst index 2b7310c7a37..e825ee48353 100644 --- a/frontend.rst +++ b/frontend.rst @@ -43,6 +43,7 @@ Adding more Features * :doc:`Enabling Vue.js (vue-loader) ` * :doc:`Configuring Babel ` * :doc:`Source maps ` +* :doc:`Enabling TypeScript (ts-loader) ` Optimizing .......... From 505d9ef036dcf47c49e88b6bf14244c28e8ad9c3 Mon Sep 17 00:00:00 2001 From: Javier Eguiluz Date: Sun, 9 Jul 2017 13:10:26 +0200 Subject: [PATCH 3/3] Minor change --- frontend/encore/typescript.rst | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/frontend/encore/typescript.rst b/frontend/encore/typescript.rst index 9298c7aa7a1..1f305d1a78c 100644 --- a/frontend/encore/typescript.rst +++ b/frontend/encore/typescript.rst @@ -31,7 +31,7 @@ also configure the `ts-loader options`_ via a callback: typeScriptConfigOptions.configFileName = '/path/to/tsconfig.json'; }); -If React assets are enabled: `enableReactPreset()`, any ``.tsx`` file will be +If React assets are enabled (``.enableReactPreset()``), any ``.tsx`` file will be processed as well by ``ts-loader``. Loader usage can be checked better in its `README`_ documentation. @@ -43,4 +43,4 @@ Loader usage can be checked better in its `README`_ documentation. .. _`TypeScript`: https://www.typescriptlang.org/ .. _`ts-loader options`: https://github.com/TypeStrong/ts-loader#options -.. _`README`: https://github.com/TypeStrong/ts-loader#typescript-loader-for-webpack \ No newline at end of file +.. _`README`: https://github.com/TypeStrong/ts-loader#typescript-loader-for-webpack