Security News
tea.xyz Spam Plagues npm and RubyGems Package Registries
Tea.xyz, a crypto project aimed at rewarding open source contributions, is once again facing backlash due to an influx of spam packages flooding public package registries.
bundle-module
Advanced tools
Readme
A no-config tool to bundle your apps into a single file using a remote Webpack configuration that spares you both the need for redundant local Webpack configuration files and an enormous glut of libraries in the node_modules directory of every project.
v0.1.7
Webpack is an incredible toolkit for compiling and transpiling Node modules for use in the browser. The only drawback, I've found, is that keeping the configuration files and their many dependencies in every local project directory can lead to a lot of bloat in node_modules
and requires a fair degree of tedious copying and pasting when many projects use essentially the same configuration.
This module generates a configuration file outside the project and returns a packaged file for the browser in the project directory.
npm install -g bundle-module
Or, for the edge version:
npm install -g wilson428/bundle-module
# cd /path/to/project
bundle-module --name=myproject
const bundleModule = require('bundle-module');
bundleModule({
entry: './myApp/index.js',
filename: 'myApp.script.js',
env: 'node',
output_dir: './dist'
});
This basic usage will create a dist
directory in your project with a file called myproject.js
that can be included on a Web page in a single <script>
tag. The project itself can include any local dependencies you wish -- D3, for example.
Option | Purpose | Default |
---|---|---|
--env | The target environment for the build. Options are node or browswer | browser |
--version , -v | Return the version and exit | false |
--entry | The root Node file in your project to send to Webpack for compiling. | index.js |
--output_dir | The name of the local directory to contain the compiled file | dist |
--filename | The name used in the compiled file. There's no need to include .js . | bundle |
--name | The name of the global variable when exporting for the browser. | name (see above) |
--min , --minified | Whether to minify the output, which will automatically have the name [filename].min.js | false |
--watch | Whether to recompile after every file change | false |
--verbose | Whether to output the (long) configuration file | false |
Using --min
defaults to production mode and generates bundle-min.js
while omitting it builds an unminified, source-mapped bundle.js
(whatever name you specified with --name
instead of bundle
). To save time, I recommend the following scripts in your package.json
for a given app:
"scripts": {
"build": "bundle-module --entry=./debug.js --name=script --env=node --output_dir=.",
"build_verbose": "bundle-module --entry=./debug.js --name=script --env=node --output_dir=. --verbose",
"watch": "bundle-module --entry=./debug.js --name=script --env=node --output_dir=. --watch",
"minify": "bundle-module --entry=./debug.js --name=script-min --env=node --output_dir=. --min"
}
Or, if you want to build a distribution script to be included as a global variable via a <script>
element, use --env=browser
(or leave it out). The global variable will be give the --name
parameter.
At present, bundle-module
will understand the following file types when included with import
or require
. If you commonly use a filetype that requires a different loader, such as a different templating engine, by all means let me know or, better yet, send me a PR!
.js
: Javascript files are automatically transpiled with Babel, allowing you to write your module in ES6..json
: Node understands JSON imports by default..css
, .scss
, .less
: Includes the postcss-loader
loader with the postcssPresetEnv
plugin for autoprefixing..html
, .ejs
: You can either require
plain HTML or Embedded JavaScript templates..csv
, .dsv
, tsv
: You can require any sort of delimited data file, which will appear in the code like a JSON file..png
, .jpe?g
, .gif
: Include images as base64 data. Be mindful of filesize.FAQs
Use Webpack to create a browser-friendly version of your npm module without muddying the repo
The npm package bundle-module receives a total of 11 weekly downloads. As such, bundle-module popularity was classified as not popular.
We found that bundle-module demonstrated a not healthy version release cadence and project activity because the last version was released a year ago. It has 1 open source maintainer collaborating on the project.
Did you know?
Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.
Security News
Tea.xyz, a crypto project aimed at rewarding open source contributions, is once again facing backlash due to an influx of spam packages flooding public package registries.
Security News
As cyber threats become more autonomous, AI-powered defenses are crucial for businesses to stay ahead of attackers who can exploit software vulnerabilities at scale.
Security News
UnitedHealth Group disclosed that the ransomware attack on Change Healthcare compromised protected health information for millions in the U.S., with estimated costs to the company expected to reach $1 billion.