Trouble with nameCleaner

[psfblair]

Description

I'm trying to add a prefix to a module registration path using nameCleaner. The path is not changed.

Details:

I'm working with Fable, an F#-to-js compiler. Output JS goes in build/dist. Unfortunately, there is a F# file in one of the node modules that also needs to get compiled to js, and Fable puts the output in a node_modules directory under my output directory. So my file tree looks like this:

app/
   assets/
   Components.fs
build/
   dist/
      app/  [my code here, including Components.js]
      node_modules/
           fable-import-react/  [Fable.Helpers.React.js and package.json here]
node_modules/
   fable-import-react [Fable.Helpers.React.fs and package.json here]

I use brunch to post-process. Here is the essential brunch configuration:

exports.config = {

  paths: {
    watched: [
      'app/assets', 
      'build/dist', 
    ]
  },
  modules: {
    nameCleaner: (path) => path.replace('fable-import-react', 'build/dist/node_modules/fable-import-react')
  },
  files: {
    javascripts: { joinTo: 'app.js' },
    stylesheets: { joinTo: 'app.css' }
  },

  plugins: {
    babel: { presets: ['es2015', 'react'] }
  },
};

Note the nameCleaner. This is because app.js is generated with

require.register("fable-import-react/Fable.Helpers.React.js", function...`

but when the module is imported the require statement looks like this:

require("./../node_modules/fable-import-react/Fable.Helpers.React")

which results in:

Components.js:5 Uncaught Error: Cannot find module 'build/dist/node_modules/fable-import-react/Fable.Helpers.React' from 'build/dist/app/Components.js'

Expected behavior

I believe the nameCleaner statement should change the require.register statement to prepend build/dist/node_modules/ to fable-import-react. However, it doesn't modify that statement at all (maybe because the module is under node_modules?).

If I change the nameCleaner to do this:

nameCleaner: (path) => path.replace('/^build\/dist\/app\//, '')

The prefix is removed from the require.register statement for the Component module, so I know the nameCleaner can remove prefixes successfully.

Note also that it doesn't make any difference if I use a regex pattern or a simple string in the nameCleaner replace; neither prepends the prefix.

Actual behavior

The prefix is not prepended to the module when it is registered.

GitHub demo: https://github.com/psfblair/fable_redux_skeleton on branch brunch-problem

[Edit: I've added to the branch the JS files compiled by Fable, as well as the node modules that are not in npm yet, so you shouldn't need to compile any F# in order to troubleshoot the issue.]

You should be able to do the build in the project directory this way:

npm install
brunch build

Environment

1. Brunch: 2.8.0
2. Node: 4.4.5
3. NPM: 2.15.5
4. Operating system: OS X 10.11.5

package.json contents

{
  "name": "your-app",
  "description": "Description",
  "author": "Your Name",
  "version": "0.0.1",
  "license": "Apache-2.0",
  "repository": {
    "type": "git",
    "url": ""
  },
  "scripts": {
    "start": "brunch watch --server",
    "prod": "brunch build --production",
    "build": "fable",
    "watch": "fable -w --target watch"
  },
  "dependencies": {
    "babel-runtime": "^6.9.2",
    "core-js": "^2.4.0",
    "fable-core": "^0.1.6",
    "fable-import-react": "0.0.16",
    "react": "~0.14.7",
    "react-dom": "~0.14.7",
    "react-redux": "~4.3.0",
    "react-router": "~2.0.0",
    "react-router-redux": "~4.0.0",
    "redux": "~3.2.1"
  },
  "devDependencies": {
    "auto-reload-brunch": "^2.7.0",
    "babel-brunch": "~6.0.0",
    "babel-plugin-transform-runtime": "^6.9.0",
    "babel-preset-es2015": "~6.3.13",
    "babel-preset-react": "~6.3.13",
    "brunch": "^2.7.0",
    "clean-css-brunch": "^2.0.0",
    "css-brunch": "^2.0.0",
    "fable-import-react-redux": "0.0.1",
    "fable-import-react-router-redux": "0.0.1",
    "fable-import-redux": "0.0.1",
    "hmr-brunch": "^0.1.0",
    "javascript-brunch": "^2.0.0",
    "less-brunch": "^2.6.0",
    "uglify-js-brunch": "^2.0.0"
  }
}

brunch config contents

exports.config = {

  paths: {
    public: 'public',

    watched: [
      'app/assets', 
      'app/styles', 
      'build/dist', 
      'test', 
      'vendor'
    ]
  },

  modules: {
    nameCleaner: (path) => path.replace('fable-import-react', 'build/dist/node_modules/fable-import-react')
  },

  files: {
    javascripts: { joinTo: 'app.js' },
    stylesheets: { joinTo: 'app.css' }
  },

  plugins: {
    babel: { presets: ['es2015', 'react'] }
  },
};

Other useful files, when present (log, bower.json etc.)

See the demo code on GitHub.

[paulmillr]

NPM 2.15.5 is not supported. Can you try this with NPM v3 and report back?

[psfblair]

Regrettably, two things have happened since I filed this issue: First, I've had to abandon development with Fable owing to other issues, and second, my custom version of Fable that includes the modules needed to make the demo work no longer builds. I think that if 2.15.5 is not supported, that is sufficient to close this issue.