Unable to include twig files outside project path

[ilkkave]

Problem/motivation

I would like to include twig files outside the project path, but currently it’s not possible, because twig resolves to wrong path with those files.

An example:
Root for project where I use twig-loader is /some/path/my_project.
I can import twig file from /some/path/my_project/templates/template.twig.
I can’t import twig file from /some/path/templates/template.twig and will get an error like:

ERROR in ../templates/template.twig
Module not found: Error: Can't resolve 'twig' in ‘/some/path/my_project’
 @ ../templates/template.twig 3:11-26
 …

Proposed resolution

Use stringifyRequest (https://github.com/webpack/loader-utils#stringifyrequest) from loader-utils to get path to twig in https://github.com/zimmo-be/twig-loader/blob/master/lib/loader.js#L33.

[ben-rogerson]

@ilkkave Another loader by megahertz takes care of this issue combined with a Webpack alias. Today I integrated it into my craft-storybook-starter if you want to take a look.

[mralexho]

@ben-rogerson thanks for the suggestion. Thought our team would be able to use this solution but it looks like twigjs-loader doesn't support concat ~ 😕

megahertz/twigjs-loader#4

[ben-rogerson]

Are there any other loaders you've found that support contact?

[mralexho]

We're looking for any workarounds. Will keep you posted if we find a solution.

[pjoulot]

Did someone found a workaround? It is pretty annoying to have to keep that file at the project level.

[stfn00]

Hi @mralexho, you have found a solution for concatenation?

We're looking for any workarounds. Will keep you posted if we find a solution.

[ilkkave]

Hi. In our project, where we use version 0.4.1 of https://github.com/AmazeeLabs/twig-loader, which is a fork from this, we have applied this patch to solve the problem:

diff --git a/node_modules/twig-loader/lib/loader.js b/node_modules/twig-loader/lib/loader.js
index d2475dd..e461f6b 100644
--- a/node_modules/twig-loader/lib/loader.js
+++ b/node_modules/twig-loader/lib/loader.js
@@ -1,6 +1,7 @@
 var Twig = require("twig");
 var path = require("path");
 var hashGenerator = require("hasha");
+var loaderUtils = require("loader-utils");
 var mapcache = require("./mapcache");
 var compilerFactory = require("./compiler");
 var getOptions = require("./getOptions");
@@ -30,7 +31,10 @@ module.exports = function(source) {
 
     tpl = tpl.compile({
         module: 'webpack',
-        twig: 'twig'
+        // Use correct path for requiring 'twig' when importing Twig templates
+        // outside project path.
+        // Fixes https://github.com/zimmo-be/twig-loader/issues/48.
+        twig: loaderUtils.stringifyRequest(this, require.resolve('twig'))
     });
 
     this.callback(null, tpl);

[stfn00]

Hi @ilkkave thanks for the reply.
I tried to make the changes but they still don't work. I also tried to use your version directly and keep giving me problems.

[padupuy]

hi @ilkkave
Use this fork #48 to solve the include problem, it works for me.
And see this file for the config of the twig namespaces https://github.com/emulsify-ds/emulsify-drupal/blob/master/.storybook/webpack.config.js