npm package discovery and stats viewer.

Discover Tips

  • General search

    [free text search, go nuts!]

  • Package details

    pkg:[package-name]

  • User packages

    @[username]

Sponsor

Optimize Toolset

I’ve always been into building performant and accessible sites, but lately I’ve been taking it extremely seriously. So much so that I’ve been building a tool to help me optimize and monitor the sites that I build to make sure that I’m making an attempt to offer the best experience to those who visit them. If you’re into performant, accessible and SEO friendly sites, you might like it too! You can check it out at Optimize Toolset.

About

Hi, 👋, I’m Ryan Hefner  and I built this site for me, and you! The goal of this site was to provide an easy way for me to check the stats on my npm packages, both for prioritizing issues and updates, and to give me a little kick in the pants to keep up on stuff.

As I was building it, I realized that I was actually using the tool to build the tool, and figured I might as well put this out there and hopefully others will find it to be a fast and useful way to search and browse npm packages as I have.

If you’re interested in other things I’m working on, follow me on Twitter or check out the open source projects I’ve been publishing on GitHub.

I am also working on a Twitter bot for this site to tweet the most popular, newest, random packages from npm. Please follow that account now and it will start sending out packages soon–ish.

Open Software & Tools

This site wouldn’t be possible without the immense generosity and tireless efforts from the people who make contributions to the world and share their work via open source initiatives. Thank you 🙏

© 2024 – Pkg Stats / Ryan Hefner

proxyquire-webpack-alias

v1.0.11

Published

Proxyquire for ES5 modules

Downloads

33

Readme

proxyquire-webpack-alias Build Status

NPM

Modification of proxyquire to work with webpack aliases. Proxies commonjs require/es6 import in order to allow overriding dependencies during testing. Just hides some webpack magic inside.

API

import proxyquire, { configure } from 'proxyquire-webpack-alias';

configure('your-own-webpack-alias.conf');// optional

proxyquire
    .anyProxyquireCall()
    .load('alias/fileName', { 'alias/dep1':{} });
// you can use webpack-aliased filenames both as module name and stub name.

Now, at last, you can use aliases as names of deps to be mocked. So you can use old proxyquire in more modern way.

the other way:

If you prefer using original proxyquire - have a look in resolveQuire. It is pure functional sugar around it, and enables same features as proxyquire-webpack-alias.

proxyquire - 2

This library uses proxyquire-2, a bit more powerfull fork of original one. For details about proxyquire-2 API – see proxyquire documentation. It is just extends functionality, 100% compatible with old one.

API

  • configire(webpack.alias.conf) allows you to overwrite location of webpack.aliases configuration file. By default one will try to find 'webpack.config.js' or 'webpack.config.babel.js' in project root.
  • defaultExport - functional class, similar to Proxyquire.

Alias behavior similar to babel-plugin-webpack-alias. As long we take some sources from it.

Using proxyquire

So you have one file. You use webpack alises and address other files using them.

import something from 'something';
import somethingElse from 'core/something';
import somethingMore from 'components/something';

And then you want to mock deps with proxyquire. But you cant.

You have to mock relative imports. And each time you have to guess the right name.

const mocked = proxyquire('source.js',{
  'something': mock,
  '../../core/something': mock, // will not work, the right path is '../../../core....'
  'shared/something': something
})

So, this lets fix this issue.

//import proxyquire from 'proxyquire';
import proxyquire from 'proxyquire-webpack-alias'; 

// now, you can mock files as you import them.
const mocked = proxyquire('source.js',{
  'something': mock,
  'core/something': mock, 
  'components/something': something
});


// and, finnaly you can be sure, that you do something RIGHT.

// next example will trigger error
const mocked = proxyquire.noUnusedStubs().load('source.js',{
  'something': mock,
  'core/something': mock, 
  'component/something': something,// <-- typo. And stub will be unsued.
});

Your own setup

If you want to extend proxyquire, for example to setup it as you want, and use it indirectly - you have to add some magic

// so you are using special version of proxyquire
import proxyquire from 'my-proxyquire';

Where my-proxyquire.js is your file

import proxyquire from 'proxyquire-webpack-alias';

// this one creates `special` proxyquire for the file it use
const myProxyquire = 
    (new proxyquire.Class(module.parent))
     // now you can setup default behavior     
     .noUnusedStubs()
     .noPreserveCache()
     .noCallThru();

// and this prevent caching. So in new place you will get new class
delete require.cache[require.resolve(__filename)];

export default myProxyquire;

PS: This is not wrapper around proxyquire, this is wrapper around proxyquire-2.