after phoenix 1.3 upgrade app.js are not loaded

Question

I updated my phoenix 1.2 to 1.3 follwing the phoenix upgrade description.

Now assets/js/app.js can't be loaded: Uncaught Error: Cannot find module 'js/app' from '/'

After debugging the problem, I found that the expected module is app not js/app.

When I change the module name in the brunch-config.js autoRequire modules to ["app"] instead of ["js/app"] it works. I don't understand what is the problem or what I did in my app, that the default settings don't work.

Here my assets/brunch-config.js

exports.config = {
  // See http://brunch.io/#documentation for docs.
  files: {
    javascripts: {
      joinTo: "js/app.js"

    },
    stylesheets: {
      joinTo: "css/app.css",
      order: {
        after: ["../priv/static/css/app.css"] // concat app.css last
      }
    },
    templates: {
      joinTo: "js/app.js"
    }
  },

  conventions: {
    assets: /^(static)/
  },

  // Phoenix paths configuration
  paths: {
    // Dependencies and current project directories to watch
    watched: ["static", "css", "js", "vendor"],

    // Where to compile files to
    public: "../priv/static"
  },

  // Configure your plugins
  plugins: {
    babel: {
      // Do not use ES6 compiler in vendor code
      ignore: [/vendor/]
    },
    copycat: {
      "fonts": ["node_modules/font-awesome/fonts"] // copy node_modules/font-awesome/fonts/* to priv/static/fonts/
    },
    sass: {
      options: {
        includePaths: [
          "node_modules/bootstrap-sass/assets/stylesheets",
          "node_modules/font-awesome/scss"
        ], // tell sass-brunch where to look for files to @import
        precision: 8 // minimum precision required by bootstrap-sass 
      }
    }
  //sass: {
    //   mode: "native" // This is the important part!
    // },
  },

  modules: {
    autoRequire: {
      "js/app.js": ["js/app"]
    }
  },

  npm: {
    enabled: true,
    globals: {
      $: 'jquery',
      jQuery: 'jquery'
    }
  }
};

And my assets/js/app.js is here:

import "phoenix_html"
import "./datetimepicker"

thanks for any help, tipps or ideas to understand/solve the problem.

I do not understand what is your problem: according to what you have said, everything works. Also, it should be ["app"], not ["js/app"]. — Aleksei Matiushkin
But, if you take a look to the upgrade instructions, it uses the js/app name. not the app. I had the same as described in the upgrade instructions. But it doesn't work as described there. I must change the name. The app.js is in assets/js/app.js. I would expect the js/app. How do you come to the conclusion, that it must be app not js/app. thx — nabinabou
“How do you come to the conclusion”—easy: app works, js/app does not. — Aleksei Matiushkin
🤔 this is not enough for me. I try to understand what is happening here and why it is not working as expected. — nabinabou
you are an unfriendly person and I hope person like you don't answer to any question, because they don't help, they blame other always for things they don't understand. It is much easier for me to search for a solution than writing a question in english (a language that I don't speak very good). I tried as I could to understand what is happening here. If I'm not experienced as you are, is not a reason to be so arrogant and blaming other for things they don't know. You can not either say anything only, it is working and that is!! — nabinabou

nabinabou nabinabou · Accepted Answer · 2017-08-30T12:49:29

The problem is related to the brunch version. updating brunch to:

[email protected]

solved the problem.

after phoenix 1.3 upgrade app.js are not loaded

1 Answers