nordth / dojo-webpack-loader Goto Github PK

Not sure whether I'm missing something, but it looks like references to 'dojo/i18n!some_module' always return the root values for some_module rather than something related to the current locale.

I can see in the generated file for a root NLS file that it injects all of the specified languages (as, say, lang_fr, lang_en, variables etc.) but they don't appear to be used anywhere in the generated module.

(For more context, this is the code that generates those variables:

           module.inject.dependencies.push({
               dep: "./" + lang + "/" + path.basename(module.resourcePath, ".js"),
               name: "lang_" + lang.replace(/-/g, "_")
           });

Is this something that's meant to work at the moment, or is it still in progress?

Thanks!

I just created a simple repository to try this out, and I'm running into an issue.

It seems 'dojo/on' requires the file path:

"./has!dom-addeventlistener?:./aspect"

Any suggestions?

Here's the repo to throw the error:
https://github.com/roemhildtg/webpack-dojo-example

I was very excited to find this loader! I've been working in a dojo app for a while now and we've always been boxed into relying on the build tool that ships with dojo.

Trying to get this working on a basic level right now, but I keep getting the following errors:

ERROR in ./~/dojo-webpack-loader/lib/no-module.js
Module build failed: TypeError: Cannot read property '0' of undefined
at resolveCoreModuleDependency (/Users/n0199601/dev/workspaces/responsive01/ESalesClient/node_modules/dojo-webpack-loader/index.js:71:39)
at Object.DojoWebpackLoader (/Users/n0199601/dev/workspaces/responsive01/ESalesClient/node_modules/dojo-webpack-loader/index.js:230:48)
@ ./src/esales/main.js 5:0-82:2

ERROR in .//dojo-webpack-loader/lib/dojo-require.js
Module build failed: TypeError: Cannot read property '0' of undefined
at resolveCoreModuleDependency (/Users/n0199601/dev/workspaces/responsive01/ESalesClient/node_modules/dojo-webpack-loader/index.js:71:39)
at Object.DojoWebpackLoader (/Users/n0199601/dev/workspaces/responsive01/ESalesClient/node_modules/dojo-webpack-loader/index.js:230:48)
@ .//dojo/_base/kernel.js 1:0-309:2

I've been tinkering with things for a while now but am at a bit of a loss. I can see that the no-module.js and dojo-require.js files are included within the loader under the lib directory. However, I'm not exactly sure how they are tied into the process or why the build would be failing because of them in this way. Any insight you could provide would be most appreciated!

I seem to be having trouble with dojo-webpack-loader when using dojo/text. I've looked through the example js files and can't find one that directly uses dojo/text or dojo/nls..

It appears as if webpack uses exclamation marks for loaders, as you alluded to in the readme. I've been able to sort of get around this if I use an alias, but I was hopeful that the dojo-webpack-loader would be able to get around these issues with webpack.

Thoughts?

I'm trying to do a build of the ESRI JS API and i have the following errors :

ERROR in ./esri/widgets/Popup.js
Module parse failed: D:\lab\dojo-webpack-loader-examples\node_modules\dojo-webpack-loader\index.js!D:\lab\dojo-webpack-loader-examples
esri\widgets\Popup.js Unexpected character '@' (172:1)
You may need an appropriate loader to handle this file type.
SyntaxError: Unexpected character '@' (172:1)
at Parser.pp$4.raise (D:\lab\dojo-webpack-loader-examples\node_modules\acorn\dist\acorn.js:2221:15)
at Parser.pp$7.getTokenFromCode (D:\lab\dojo-webpack-loader-examples\node_modules\acorn\dist\acorn.js:2756:10)
at Parser.pp$7.readToken (D:\lab\dojo-webpack-loader-examples\node_modules\acorn\dist\acorn.js:2477:17)
at Parser.pp$7.nextToken (D:\lab\dojo-webpack-loader-examples\node_modules\acorn\dist\acorn.js:2468:15)
at Parser.pp$7.next (D:\lab\dojo-webpack-loader-examples\node_modules\acorn\dist\acorn.js:2413:10)
at Parser.pp.eat (D:\lab\dojo-webpack-loader-examples\node_modules\acorn\dist\acorn.js:536:12)
at Parser.pp$2.parseBindingList (D:\lab\dojo-webpack-loader-examples\node_modules\acorn\dist\acorn.js:1425:18)
at Parser.pp$1.parseFunctionParams (D:\lab\dojo-webpack-loader-examples\node_modules\acorn\dist\acorn.js:1072:24)
at Parser.pp$1.parseFunction (D:\lab\dojo-webpack-loader-examples\node_modules\acorn\dist\acorn.js:1064:10)
at Parser.pp$3.parseExprAtom (D:\lab\dojo-webpack-loader-examples\node_modules\acorn\dist\acorn.js:1810:19)
at Parser.pp$3.parseExprSubscripts (D:\lab\dojo-webpack-loader-examples\node_modules\acorn\dist\acorn.js:1715:21)
at Parser.pp$3.parseMaybeUnary (D:\lab\dojo-webpack-loader-examples\node_modules\acorn\dist\acorn.js:1692:19)
at Parser.pp$3.parseExprOps (D:\lab\dojo-webpack-loader-examples\node_modules\acorn\dist\acorn.js:1637:21)
at Parser.pp$3.parseMaybeConditional (D:\lab\dojo-webpack-loader-examples\node_modules\acorn\dist\acorn.js:1620:21)
at Parser.pp$3.parseMaybeAssign (D:\lab\dojo-webpack-loader-examples\node_modules\acorn\dist\acorn.js:1597:21)
at Parser.pp$3.parseExprList (D:\lab\dojo-webpack-loader-examples\node_modules\acorn\dist\acorn.js:2165:22)
at Parser.pp$3.parseSubscripts (D:\lab\dojo-webpack-loader-examples\node_modules\acorn\dist\acorn.js:1741:35)
at Parser.pp$3.parseExprSubscripts (D:\lab\dojo-webpack-loader-examples\node_modules\acorn\dist\acorn.js:1718:17)
at Parser.pp$3.parseMaybeUnary (D:\lab\dojo-webpack-loader-examples\node_modules\acorn\dist\acorn.js:1692:19)
at Parser.pp$3.parseExprOps (D:\lab\dojo-webpack-loader-examples\node_modules\acorn\dist\acorn.js:1637:21)
at Parser.pp$3.parseMaybeConditional (D:\lab\dojo-webpack-loader-examples\node_modules\acorn\dist\acorn.js:1620:21)
at Parser.pp$3.parseMaybeAssign (D:\lab\dojo-webpack-loader-examples\node_modules\acorn\dist\acorn.js:1597:21)
at Parser.pp$3.parseExpression (D:\lab\dojo-webpack-loader-examples\node_modules\acorn\dist\acorn.js:1573:21)
at Parser.pp$1.parseStatement (D:\lab\dojo-webpack-loader-examples\node_modules\acorn\dist\acorn.js:727:47)
at Parser.pp$1.parseTopLevel (D:\lab\dojo-webpack-loader-examples\node_modules\acorn\dist\acorn.js:638:25)
at Parser.parse (D:\lab\dojo-webpack-loader-examples\node_modules\acorn\dist\acorn.js:516:17)
at Object.parse (D:\lab\dojo-webpack-loader-examples\node_modules\acorn\dist\acorn.js:3098:39)
at Parser.parse (D:\lab\dojo-webpack-loader-examples\node_modules\webpack\lib\Parser.js:902:15)
at DependenciesBlock. (D:\lab\dojo-webpack-loader-examples\node_modules\webpack\lib\NormalModule.js:104:16)
at DependenciesBlock.onModuleBuild (D:\lab\dojo-webpack-loader-examples\node_modules\webpack-core\lib\NormalModuleMixin.js:310:10)
@ ./esri/views/View.js 25:0-6182

You can do some test with my repo :
https://github.com/g3r4n/dojo-webpack-loader-examples

When I use the loader in a project based on example provided I get following warnings.

WARNING in ./src/main/webapp/modules/dojo/_base/browser.js
Critical dependencies:
1:3-10 require function is used in a way in which dependencies cannot be statically extracted
2:1-8 require function is used in a way in which dependencies cannot be statically extracted
@ ./src/main/webapp/modules/dojo/_base/browser.js 1:3-10 2:1-8

WARNING in ./src/main/webapp/modules/dojo/_base/configRhino.js
Critical dependencies:
102:6-13 require function is used in a way in which dependencies cannot be statically extracted
@ ./src/main/webapp/modules/dojo/_base/configRhino.js 102:6-13

Does onyone else saw this warning?

I had a problem with module dependecy in some files which will be processed by the webpack NodeStuffPlugin.

Situation is as follows:

The dojo-webpack-loader will prepend your module body with module={id:normalizedModuleName} if you have module as AMD dependency. If you use module.id in your code this will be replaced by the NodeStuffPlugin with module.i whilst module={id:normalizedModuleName} doesn't get replaced. This leads to several undefined errors on runtime.

Solution

A solution for this is to change the prepend code to module={}; module.id = normalizedModuleName; which can be achieved by replacing line 169 in index.js with
module.inject.prepend += `${dep.name}={}; ${dep.name}.id=${JSON.stringify(module.normalizedName ? module.normalizedName : '')}`;

I just updated to webpack v2.2.1 and am now getting an error.

`Invalid configuration object. Webpack has been initialised using a configuration object that does not match the API schema.

• configuration has an unknown property 'dojoWebpackLoader'. These properties are valid:
  object { amd?, bail?, cache?, context?, dependencies?, devServer?, devtool?, entry, externals?, loader?, module?, name?, node?, output?, performance?, plugins?, profile?, recordsInputPath?, recordsOutputPath?, recordsPath?, res
  target?, watch?, watchOptions? }
  For typos: please correct them.
  For loader options: webpack 2 no longer allows custom properties in configuration.
  Loaders should be updated to allow passing options via loader options in module.rules.
  Until loaders are updated one can use the LoaderOptionsPlugin to pass these options to the loader:
  plugins: [
  new webpack.LoaderOptionsPlugin({
  // test: /.xxx$/, // may apply this only for some modules
  options: {
  dojoWebpackLoader: ...
  }
  })
  ]`

Looks like including "dojo/i18n!./nls/SomeFile" as a dependency in a source file breaks when building via dojo-webpack-loader.

Error is:

ERROR in ./widgets/SourceDir/SourceFile.js
Module not found: Error: Cannot resolve module 'dojo/i18n' in [project]\src\widgets\SourceDir
 @ ./widgets/SourceDir/SourceFile.js 1:0-124:2

The source file SourceFile.js looks like:

require([
  //...
  "dojo/i18n!./nls/SomeFile"
], function (
  //...
  nls
) {
  //...
});

I'm confused, because it looks like dojo/i18n is supposed to be supported in the source (index.js):

            case 'dojo/text':
                // use webpack raw-loader instead of dojo/text
                result_loaders.push("raw");
                break;
            case 'dojo/i18n':
                // Will be loaded via DojoWebpackLoader
                break;
            default:
                debugger;
                break;

Is there something I'm missing?

Dojo toolkit is an awesome framework but doesn't play well with other build/package systems and when I found your project I was pleasantly surprised,

Your contribution is hugely appreciated, thank you 👍

I have a solution on how to add support for domReady (in my own local branch), how do I go about doing a pull request? Do I need to fork the repo before I can make a pull request?

Hi! At first, let me say thanks for this awesome package. Our team was happy to find it.

During the migration we encountered some problems with _WidgetsInTemplateMixin. Because the default Dojo loader was not used, _WidgetsInTemplateMixin was not able to get the loaded widgets from the Dojo modules cache.

For example, if we have something like that:

<div class="${rootLayout}">
  <div data-dojo-type="dijit/layout/ContentPane"
       data-dojo-attach-point="toolbarRegion">
    Toolbar
  </div>
</div>

then _WidgetsInTemplateMixin cannot find the ContentPane and gonna try to require it using the default Dojo loader. And it fails for the obvious reasons.

To fix this problem we found the next solution: in widgets that uses _WidgetsInTemplateMixin we just define contextRequire property. It looks like this:

contextRequire: {
  _dojoParserCtorMap: {
    'dijit/layout/ContentPane': require('dijit/layout/ContentPane'),
  },
},

In this case _WidgetsInTemplateMixin doesn't try to load the widgets but just takes them from the _dojoParserCtroMap property. We can just define in this way all widgets that are used in the template, and it works just fine.

Hope this will help someone who got the same problems.

P.S. After writing this message I found in the Readme, that dojo-webpack-loader provides some API to register widgets 😅. @Nordth could you please explain how to use it?