plasticine / inject-loader

💉📦 A Webpack loader for injecting code into modules via their dependencies.
https://www.npmjs.com/package/inject-loader
MIT License
484 stars 47 forks source link

Webpack + coffeescript + inject-loader #42

Closed adamyonk closed 7 years ago

adamyonk commented 7 years ago

I'm seeing this issue:

PhantomJS 2.1.1 (Mac OS X 0.0.0) ERROR
  Error: Module parse failed: /Users/adamyonk/Code/spaces/node_modules/inject-loader/dist/index.js!/Users/adamyonk/Code/spaces/node_modules/coffee-loader/index.js!/Users/adamyonk/Code/spaces/app/assets/javascripts/views/multi_dimensional/chart_stream.coffee 'import' and 'export' may only appear at the top level (29:4)
  You may need an appropriate loader to handle this file type.
  |
  |   (function () {
  |     import defer from 'lodash/defer';
  |     import extend from 'lodash/extend';
  |     import isEqual from 'lodash/isEqual';
  at tests/tests.webpack.js:239466

Babel config:

{
  "plugins": [
    "lodash",
    "react-hot-loader/babel"
  ],
  "presets": [
    "react",
    "env",
    "stage-1"
  ]
}

I have this loader in my webpack config:

        {
          test: /\.coffee$/,
          use: [ { loader: 'coffee-loader' } ],
        },

And I'm trying to use inject-loader like so:

injector = require('inject-loader!views/multi_dimensional/chart_stream')
view = injector({
  ...
})

I assume this has to do with essentially doing 'inject-loader!coffee-loader!myfile'. Do you have any guidance for how to configure this in a project that is also using coffee-loader (or some other lang-loader)? Thank you!

adamyonk commented 7 years ago

AH, coffee files were never touching babel, so the import/exports were being left in. Changing my loader to:

        {
          test: /\.coffee$/,
          use: [ { loader: 'babel-loader' }, { loader: 'coffee-loader' } ],
        },

seems to have fixed that issue.

plasticine commented 7 years ago

@adamyonk Glad you got it worked out! :)