Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Module not found: Error: Can't resolve... #88

Open
Olivr3 opened this issue Aug 15, 2017 · 0 comments
Open

Module not found: Error: Can't resolve... #88

Olivr3 opened this issue Aug 15, 2017 · 0 comments

Comments

@Olivr3
Copy link

Olivr3 commented Aug 15, 2017

I am getting the following error after running yarn test.

ERROR in ./test/components/FabMenuItemTest.js
Module not found: Error: Can't resolve 'components//FabMenuItem.js' in '/var/www/pandle-mobile-app/master/pandle-mobile-app/test/components'
@ ./test/components/FabMenuItemTest.js 7:19-56
@ ./test (Test.js$)
@ ./test/loadtests.js

I think there is something to do with setting an absolute path.
What Am I missing here?

Code Structure

  • src
    • components
    • containers
    • reducers
    • sagas
    • ....
  • test
    • components
    • containers
    • reducers
    • sagas
    • ....
    • loadtests.js

package.json


{
  "name": "pandle-mobile",
  "private": true,
  "version": "0.0.1",
  "description": "pandle-mobile - Generated by generator-react-webpack",
  "main": "src/index.js",
  "scripts": {
    "clean": "rimraf www/*",
    "copy": "copyfiles -f ./src/index.html ./www && copyfiles -u 1 \"./src/static/**\" ./www",
    "dist": "npm run clean && npm run copy && webpack --progress --bail --env dist -p",
    "lint": "eslint ./src",
    "posttest": "npm run lint",
    "release:major": "npm version prerelease && git push --follow-tags && npm publish --tag beta",
    "release:minor": "npm version prerelease && git push --follow-tags && npm publish --tag beta",
    "release:patch": "npm version prerelease && git push --follow-tags && npm publish --tag beta",
    "serve:dev": "webpack-dev-server --open --env dev",
    "serve:vm": "webpack-dev-server --open --env vm",
    "serve:dist": "webpack-dev-server --open --env dist -p --progress",
    "start": "npm run serve:dev",
    "test": "cross-env NODE_ENV=test karma start",
    "test:watch": "cross-env NODE_ENV=test karma start --autoWatch=true --singleRun=false --reporters=mocha,coverage",
    "download-fixtures": "node scripts/download_fixtures.js",
    "storybook": "start-storybook -p 9001 -c .storybook",
    "storybook-vm": "cross-env CHOKIDAR_USEPOLLING=true STORYBOOK_ENV=vm start-storybook -p 9001 -c .storybook"
  },
  "repository": "",
  "keywords": [],
  "author": "Your name here",
  "devDependencies": {
    "axios": "^0.15.3",
    "babel-core": "^6.7.6",
    "babel-eslint": "^7.1.0",
    "babel-loader": "^6.4.0",
    "babel-plugin-istanbul": "^3.1.2",
    "babel-plugin-transform-decorators-legacy": "^1.3.4",
    "babel-plugin-transform-object-rest-spread": "^6.8.0",
    "babel-polyfill": "^6.20.0",
    "babel-preset-airbnb": "^2.0.0",
    "babel-preset-es2015-native-modules": "^6.6.0",
    "babel-preset-react": "^6.5.0",
    "chai": "^3.5.0",
    "copyfiles": "^1.0.0",
    "cordova": "^6.5.0",
    "cross-env": "^3.2.3",
    "css-loader": "^0.26.4",
    "enzyme": "^2.7.0",
    "eslint": "^3.17.1",
    "eslint-config-airbnb": "^13.0.0",
    "eslint-loader": "^1.3.0",
    "eslint-plugin-import": "^2.2.0",
    "eslint-plugin-jsx-a11y": "^2.2.0",
    "eslint-plugin-react": "^6.9.0",
    "file-loader": "^0.9.0",
    "intl": "^1.2.5",
    "intl-locales-supported": "^1.0.0",
    "karma": "^1.0.0",
    "karma-chai": "^0.1.0",
    "karma-coverage": "^1.0.0",
    "karma-junit-reporter": "^1.0.0",
    "karma-mocha": "^1.0.1",
    "karma-mocha-reporter": "^2.0.3",
    "karma-phantomjs-launcher": "^1.0.3",
    "karma-sinon": "^1.0.5",
    "karma-sourcemap-loader": "^0.3.7",
    "karma-webpack": "^1.8.1",
    "localforage": "^1.4.3",
    "material-design-iconic-font": "^2.2.0",
    "material-ui": "^0.16.6",
    "mkdirp": "^0.5.1",
    "mocha": "^3.0.0",
    "moment": "^2.17.1",
    "node-sass": "^3.7.0",
    "null-loader": "^0.1.1",
    "numeral": "^2.0.4",
    "phantomjs-prebuilt": "^2.1.7",
    "react": "^15.4.2",
    "react-addons-css-transition-group": "^15.4.2",
    "react-addons-test-utils": "^15.4.2",
    "react-autobind": "^1.0.6",
    "react-css-modules": "^4.1.0",
    "react-dom": "^15.0.1",
    "react-hot-loader": "^3.0.0-beta.6",
    "react-material-iconic-font": "^1.2.0",
    "react-redux": "^5.0.1",
    "react-swipeable-views": "^0.10.3",
    "react-tap-event-plugin": "^2.0.1",
    "react-waypoint": "^5.0.3",
    "redux": "^3.6.0",
    "redux-form": "^6.5.0",
    "redux-persist": "^4.2.0",
    "redux-saga": "^0.15.3",
    "redux-saga-test-plan": "^2.1.0",
    "request": "^2.81.0",
    "reselect": "^2.5.4",
    "rimraf": "^2.5.2",
    "sass-loader": "^3.2.0",
    "sinon": "^1.17.7",
    "style-loader": "^0.13.1",
    "url-loader": "^0.5.7",
    "webpack": "^2.1.0-beta.6",
    "webpack-dev-server": "^2.1.0-beta",
    "whatwg-fetch": "^2.0.1"
  },
  "dependencies": {
    "@kadira/storybook": "^2.35.3",
    "@kadira/storybook-addon-knobs": "^1.7.1",
    "@kadira/storybook-addon-notes": "^1.0.1",
    "prop-types": "^15.5.9",
    "react-test-renderer": "^15.6.1",
    "storybook-addon-material-ui": "^0.7.8",
    "storybook-host": "^1.0.14",
    "webpack-combine-loaders": "^2.0.3"
  }
}

karma.conf.js

'use strict';

const webpackCfg = require('./webpack.config')('test');

module.exports = function karmaConfig(config) {

  config.set({
    browsers: ['PhantomJS'],
    files: [
      'test/loadtests.js'
    ],
    port: 8080,
    captureTimeout: 60000,
    frameworks: [
      'mocha',
      'chai',
      'sinon'
    ],
    client: {
      mocha: {}
    },
    singleRun: true,
    reporters: ['mocha', 'coverage', 'junit'],
    mochaReporter: {
      output: 'autowatch'
    },
    preprocessors: {
      'test/loadtests.js': ['webpack', 'sourcemap']
    },
    webpack: webpackCfg,
    webpackServer: {
      noInfo: true
    },
    junitReporter: {
      outputDir: 'coverage',
      outputFile: 'junit-result.xml',
      useBrowserName: false
    },
    coverageReporter: {
      dir: 'coverage/',
      watermarks: {
        statements: [70, 80],
        functions: [70, 80],
        branches: [70, 80],
        lines: [70, 80]
      },
      reporters: [
        { type: 'text' },
        {
          type: 'html',
          subdir: 'html'
        },
        {
          type: 'cobertura',
          subdir: 'cobertura'
        },
        {
          type: 'lcovonly',
          subdir: 'lcov'
        }
      ]
    }
  });
};

loadtests.js

'use strict';

// Add support for Promise objects via polyfills
import 'babel-polyfill';

// Add support for all files in the test directory
const testsContext = require.context('.', true, /(Test\.js$)/);
testsContext.keys().forEach(testsContext);

conf/webpack/Base.js

'use strict';  // eslint-disable-line

/**
 * Webpack configuration base class
 */
const fs = require('fs');
const path = require('path');

const npmBase = path.join(__dirname, '../../node_modules');

class WebpackBaseConfig {

  constructor() {
    this._config = {};
  }

  /**
   * Get the list of included packages
   * @return {Array} List of included packages
   */
  get includedPackages() {
    return [].map((pkg) => fs.realpathSync(path.join(npmBase, pkg)));
  }

  /**
   * Set the config data.
   * This will always return a new config
   * @param {Object} data Keys to assign
   * @return {Object}
   */
  set config(data) {
    this._config = Object.assign({}, this.defaultSettings, data);
    return this._config;
  }

  /**
   * Get the global config
   * @return {Object} config Final webpack config
   */
  get config() {
    return this._config;
  }

  /**
   * Get the environment name
   * @return {String} The current environment
   */
  get env() {
    return 'dev';
  }

  /**
   * Get the absolute path to src directory
   * @return {String}
   */
  get srcPathAbsolute() {
    return path.resolve('./src');
  }

  /**
   * Get the absolute path to tests directory
   * @return {String}
   */
  get testPathAbsolute() {
    return path.resolve('./test');
  }

  /**
   * Get the default settings
   * @return {Object}
   */
  get defaultSettings() {
    const cssModulesQuery = {
      modules: true,
      importLoaders: 1,
      localIdentName: '[name]-[local]-[hash:base64:5]'
    };

    return {
      context: this.srcPathAbsolute,
      devtool: 'eval',
      devServer: {
        contentBase: './src/',
        publicPath: '/assets/',
        historyApiFallback: true,
        hot: true,
        inline: true,
        port: 8000
      },
      entry: ['babel-polyfill', './index.js'],
      module: {
        rules: [
          {
            enforce: 'pre',
            test: /\.js?$/,
            include: this.srcPathAbsolute,
            loader: 'babel-loader',
            query: {
              presets: ['es2015']
            }
          },
          {
            test: /^.((?!cssmodule).)*\.css$/,
            loaders: [
              { loader: 'style-loader' },
              { loader: 'css-loader' }
            ]
          },
          {
            test: /\.(png|jpg|gif|mp4|ogg|svg|ttf|woff|woff2)$/,
            loader: 'file-loader'
          },
          {
            test: /^.((?!cssmodule).)*\.(sass|scss)$/,
            loaders: [
              { loader: 'style-loader' },
              { loader: 'css-loader' },
              { loader: 'sass-loader' }
            ]
          },
          {
            test: /^.((?!cssmodule).)*\.less$/,
            loaders: [
              { loader: 'style-loader' },
              { loader: 'css-loader' },
              { loader: 'less-loader' }
            ]
          },
          {
            test: /^.((?!cssmodule).)*\.styl$/,
            loaders: [
              { loader: 'style-loader' },
              { loader: 'css-loader' },
              { loader: 'stylus-loader' }
            ]
          },
          {
            test: /\.json$/,
            loader: 'json-loader'
          },
          {
            test: /\.(js|jsx)$/,
            include: [].concat(
              this.includedPackages,
              [this.srcPathAbsolute]
            ),
            loaders: [
              // Note: Moved this to .babelrc
              { loader: 'babel-loader' }
            ]
          },
          {
            test: /\.cssmodule\.(sass|scss)$/,
            loaders: [
              { loader: 'style-loader' },
              {
                loader: 'css-loader',
                query: cssModulesQuery
              },
              { loader: 'sass-loader' }
            ]
          },
          {
            test: /\.cssmodule\.css$/,
            loaders: [
              { loader: 'style-loader' },
              {
                loader: 'css-loader',
                query: cssModulesQuery
              }
            ]
          },
          {
            test: /\.cssmodule\.less$/,
            loaders: [
              { loader: 'style-loader' },
              {
                loader: 'css-loader',
                query: cssModulesQuery
              },
              { loader: 'less-loader' }
            ]
          },
          {
            test: /\.cssmodule\.styl$/,
            loaders: [
              { loader: 'style-loader' },
              {
                loader: 'css-loader',
                query: cssModulesQuery
              },
              { loader: 'stylus-loader' }
            ]
          }
        ]
      },
      output: {
        path: path.resolve('./www/assets'),
        filename: 'app.js',
        publicPath: './assets/'
      },
      plugins: [],
      resolve: {
        alias: {
          actions: `${this.srcPathAbsolute}/actions/`,
          components: `${this.srcPathAbsolute}/components/`,
          config: `${this.srcPathAbsolute}/config/${this.env}.js`,
          images: `${this.srcPathAbsolute}/images/`,
          sources: `${this.srcPathAbsolute}/sources/`,
          stores: `${this.srcPathAbsolute}/stores/`,
          styles: `${this.srcPathAbsolute}/styles/`
        },
        extensions: ['.js', '.jsx'],
        modules: [
          this.srcPathAbsolute,
          'node_modules'
        ]
      }
    };
  }
}

module.exports = WebpackBaseConfig;

thx in advance.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

1 participant