question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Looking for jasmine when building with webpack

See original GitHub issue

First, thanks for this. It´s really helpful!

I came across some weird dependecy-errors from jasmine (don´t know if related), since i installed (npm) and required your plugin, and then building with webpack. However, the build itself seems to work. I temporary uninstalled jasmine to prevent unrelated errors and here is what webpack tells me know after building:

  Webpack built in 17389ms - ./~/moment-precise-range-plugin/test/node-tests.js
  Module not found: Error: Cannot resolve module 'jasmine' in /path/to/project/node_modules/moment-precise-range-plugin/test
  resolve module jasmine in /path/to/project/node_modules/moment-precise-range-plugin/test
    looking for modules in /path/to/project/node_modules
      /path/to/project/node_modules/jasmine doesn't exist (module as directory)
      resolve 'file' jasmine in /path/to/project/node_modules
        resolve file
          /path/to/project/node_modules/jasmine doesn't exist
          /path/to/project/node_modules/jasmine.js doesn't exist
          /path/to/project/node_modules/jasmine.json doesn't exist
  [/path/to/project/node_modules/jasmine]
  [/path/to/project/node_modules/jasmine]
  [/path/to/project/node_modules/jasmine.js]
  [/path/to/project/node_modules/jasmine.json]

I´m kind of confused since this is not happening with any other module. I don´t even find the place where ‘node-tests-js’ is loaded. Funny thing: If i delete the folder test in the modules folder, there´s no error occuring anymore.

It seems it has something to do with your test code or some missing dependencies. Tell me, if i can help you bugfixing.

Or is it my shitty webpack configuration?

  import webpack from 'webpack';
  import autoprefixer from 'autoprefixer';
  import HtmlWebpackPlugin from 'html-webpack-plugin';
  import config from '../../config';

  module.exports = {
    entry: {
      main: `./${config.srcDir}/main.js`,
      vendor: `./${config.srcDir}/vendor.js`
    },
    output: {
      path: `./${config.buildDir}`,
      filename: GLOBAL.environment === 'production' ? "[name]_[hash].js" : "[name].js",
      chunkFilename: "[chunkhash].js",
      publicPath: config.build.DEPLOY_BASE
    },
    module: {
      loaders: [
        {
          test: /\.js$/,
          loader: `babel!preprocess?${JSON.stringify(config.build)}`,
          exclude: /(node_modules|bower_components)/
        },
        {
          test: /\.html$/,
          loader: `html!preprocess?${JSON.stringify(config.build)}`
        },
        {
          test: /\.s?css$/,
          loaders: ['exports?module.exports.toString()', 'css', 'postcss-loader', 'sass']
        },
        {
          test: /\.(png|gif)$/i,
          loaders: [
            'url?limit=10000',
            'image-webpack?{bypassOnDebug:true, optimizationLevel:7, interlaced:true}'
          ]
        },
        {
          test: /\.(jpe?g)$/i,
          loaders: ['file', 'image-webpack?{bypassOnDebug:true, progressive: true}']
        },
        {
          test: /\.(mp4|ogv|webm)$/i,
          loader: 'file'
        },
        // from https://shellmonger.com/2016/01/22/working-with-fonts-with-webpack/
        {
          test: /\.(eot|ttf|woff|woff2|svg)(\?v=\d+\.\d+\.\d+)?$/,
          loader: 'file?name=fonts/[name].[ext]'
        }
      ]
    },
    resolve: {
      extensions: ['','.js','.json']
    },
    htmlLoader: {
      caseSensitive: true,
      minimize: false,
      attrs: ['img:src', 'video:src', 'source:src']
    },
    postcss: [ autoprefixer({ browsers: ['last 2 versions'] }) ],
    plugins: [
      new webpack.optimize.CommonsChunkPlugin('vendor', 'vendor.js', Infinity),
      new HtmlWebpackPlugin({
        template: `./${config.srcDir}/index.html`
      }),
      new HtmlWebpackPlugin({
        filename: 'demo.html',
        template: `./${config.srcDir}/demo.html`
      }),
      new webpack.optimize.UglifyJsPlugin({
        comments: false,
        mangle: false
      })
    ],
    devtool: GLOBAL.environment === 'production' ? 'source-map' : 'eval-source-map',
    debug: !(GLOBAL.environment === 'production')
  };

Thanks and regards, Stefan

Issue Analytics

  • State:closed
  • Created 7 years ago
  • Reactions:2
  • Comments:10 (3 by maintainers)

github_iconTop GitHub Comments

1reaction
ADagencommented, Jul 4, 2016

Hi there! Doest’n suit for me, problem still remains. Also with webpack. I’m using moment-precise-range-plugin@1.2.0 on npm v3.8.3 and node v5.10.1

.../private_site/static_member/frontendsource/node_modules/webpack-core/lib/NormalModuleMixin.js:163
            if(isError) throw e;
                        ^
Error: ./~/moment-precise-range-plugin/test/node-tests.js
Module not found: Error: Cannot resolve module 'jasmine' in .../private_site/static_member/frontendsource/node_modules/moment-precise-range-plugin/test
resolve module jasmine in .../private_site/static_member/frontendsource/node_modules/moment-precise-range-plugin/test
  looking for modules in .../private_site/static_member/frontendsource/node_modules
    .../private_site/static_member/frontendsource/node_modules/jasmine doesn't exist (module as directory)
    resolve 'file' jasmine in .../private_site/static_member/frontendsource/node_modules
      resolve file
        .../private_site/static_member/frontendsource/node_modules/jasmine doesn't exist
        .../private_site/static_member/frontendsource/node_modules/jasmine.js doesn't exist
        .../private_site/static_member/frontendsource/node_modules/jasmine.rt doesn't exist
[.../private_site/static_member/frontendsource/node_modules/jasmine]
[.../private_site/static_member/frontendsource/node_modules/jasmine]
[.../private_site/static_member/frontendsource/node_modules/jasmine.js]
[.../private_site/static_member/frontendsource/node_modules/jasmine.rt]
 @ ./~/moment-precise-range-plugin/test/node-tests.js 1:14-32

1reaction
jeongsdcommented, May 22, 2016

I think test folder ignore in .npmignore file or add files field in moment-precise-range/package.json

Example

{
  "name": "moment-precise-range-plugin",
  "version": "1.1.1",
  "description": "This is a plugin for the moment.js JavaScript library, to display date/time ranges precisely, in a human-readable format.",
  "files": [
    "*.md",
    "moment-precise-range.js"
  ],
  "main": "moment-precise-range.js",
  "directories": {
    "test": "test"
  },
  "scripts": {
    "test": "cd test && node node-tests.js"
  },
  "repository": {
    "type": "git",
    "url": "git+https://github.com/codebox/moment-precise-range.git"
  },
  "tonicExampleFilename" : "example/example.js",
  "author": "Rob Dawson <rob@codebox.org.uk> (http://codebox.org.uk)",
  "license": "MIT",
  "bugs": {
    "url": "https://github.com/codebox/moment-precise-range/issues"
  },
  "homepage": "https://github.com/codebox/moment-precise-range#readme"
}
Read more comments on GitHub >

github_iconTop Results From Across the Web

Trying to get Jasmine to work with Webpack - Stack Overflow
I'm trying to migrate a project from tsc to webpack so I can bundle all the scripts. Right now, I'm running into an...
Read more >
TypeScript starter project w/ Webpack 4, Karma, Jasmine
This tutorial showcases a starter project for people who want to use TypeScript w/ a stater project already setup to deploy to browsers ......
Read more >
devrafalko/webpack-karma-jasmine: Configuration ... - GitHub
This boilerplate package will let you use karma in your projects. Use npm install webpack-karma-jasmine instead of installing all dependencies and loaders ...
Read more >
Adding Jasmine JavaScript specs to a Webpack(er) project
The goal is to get Jasmine specs running in a Rails project using Webpacker, with the browser based test runner. Should be easily...
Read more >
Testing a React app in browsers with Jasmine
This tutorial will explain how to set up jasmine-browser-runner to test React applications in web browsers. You can follow a similar process to...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found