How to use webpack.config file into the protractor.config file

Help Requests
1

when I import webpack.config.js file into the protractor.config.js file
protractor gives me an error

error
error.png1287Ă—965 64.4 KB

my target is dynamically to import webpack devServer config into the protractor
how can I do it ?
thanks

1 Like
2

the issue most likely is that your webpack.config.js contains ESNext features. When protractor launches, it has no built in babel/bundler support or the likes and as such caughs when seeing the mentioned “import” from the error.

So you either have to transpile your conf beforehand with Babel and redirect protractor to use that resulting dist or restructure your build task to exclude the shared information into a new file which can be used without transpilation

1 Like
3

can you help me with some code ?

1 Like
4

well in this specific case it seems that config.devServer is merely a part of the configuration. So why not import from webpack.config.js instead?

The file has

devServer: {
    contentBase: outDir,
    // serve index.html for all 404 (required for push-state)
    historyApiFallback: true
  },

defined, so extract that into a variable devServer and export it. In your protractor conf import that instead.

// protractor.conf.js

const devServer = require("../webpack.config").devServer;

// webpack.config.js
const path = require('path');
...
const title = 'Aurelia Navigation Skeleton';
const outDir = path.resolve(__dirname, project.platform.output);
...
// EXTRACT DEVSERVER HERE
const devServer = {
  contentBase: outDir,
  // serve index.html for all 404 (required for push-state)
  historyApiFallback: true
};
// END EXTRACT

module.exports = ({ production, server, extractCss, coverage, analyze, karma } = {}) => ({
  ...
  devServer: devServer,
  ...
});

// EXPORT DEVSERVER
module.exports.devServer = devServer;
2 Likes