Sponsored Content
Top Forums Web Development Optimizing Vue.js webpack chunks in webpack.base.conf.js Post 303033713 by Neo on Wednesday 10th of April 2019 11:43:12 AM
Old 04-10-2019
Optimizing Vue.js webpack chunks in webpack.base.conf.js

Recently, the Vue.js app I am building starting getting some very large chucks which were causing the javascript to load very slowly.

I added some code to webpack.base.conf.js and it made a huge difference in chuck optimization and loading time:

Code:
module.exports = {
  optimization: {
    splitChunks: {
      chunks: "all"
    }
  },
 
 /* other stuff here */
}

This small change in the webpack configuration resulted in a huge improvement in load times. Incredible.

External Ref: SplitChunksPlugin | webpack

Internal Ref: UserCP Screeching Frog 0.7493
This User Gave Thanks to Neo For This Post:
 

10 More Discussions You Might Find Interesting

1. UNIX for Advanced & Expert Users

Configuring snmpd.conf and snmptrapd.conf

HI, I want a help for Configuring snmpd.conf and snmptrapd.conf (i.e Configuring SNMP) for receiving TRAPS in my networks. I am using RHEL4.0 OS. Please tell me How I can configure above two files in a proper way and at an advanced level. Especially I am getting... (2 Replies)
Discussion started by: jagdish.machhi@
2 Replies

2. Solaris

basic question on sd.conf and lpc.conf file

Hello Guys, Do we need to configure this file only if we add SAN disk or even if we add local disk, do we need to modify? (4 Replies)
Discussion started by: mokkan
4 Replies

3. Red Hat

CentOS 6.1 base install (like FreeBSD base install)?

Hello, What is the simplest way to install CentOS 6.1 with console base-system only using official LiveDVD image on VirtualBox machine? I'd like to get simplest console with network support like FreeBSD base installation. Then, install services which I need. The installer jest extracts the... (2 Replies)
Discussion started by: newbie_develope
2 Replies

4. Shell Programming and Scripting

onstat -d chunks perl monitor

I have a file I need to monitor with a perl script with the following format. I need to send off a 0 if it is above 95 in the 5th colum and a 1 if it is below. Any help on a simple perl script would be great. 75424958 999975 983170 /dev/rmetrochunk00 98.32 760c2dd8 ... (3 Replies)
Discussion started by: jlaigo2
3 Replies

5. Shell Programming and Scripting

Combining chunks of data

Hi there! Need help on some issue, I have data like this: 123 456 789 012 i need it to be like this: 123789 456012 Anyone has any idea how to do this? Thanks! Regards, Ken How to use code tags (8 Replies)
Discussion started by: kennethtls
8 Replies

6. Red Hat

Free() corrupted unsorted chunks

We are migrating Pro*C code from SOLARIS to LINUX-Redhat. While migrating we face memory de-allocation issue intermittently when accessing large volume of data. Below is the part of the code(since code is big I am putting the part of the code where the issue comes): ... (8 Replies)
Discussion started by: Karunx
8 Replies

7. Shell Programming and Scripting

Script to update rsyslog.conf and auditd.conf

Hello all, Newbie here. I'm currently tasked with updating rsyslog.conf and auditd.conf on a large set of servers. I know the exact logging configurations that I want to enable. I have updated both files on on a server and hope to use the updated files as a template for the rest of the... (3 Replies)
Discussion started by: Mide
3 Replies

8. Solaris

Configure resolv.conf and nsswitch.conf

Hi, I've installed Solaris 11.3(live media) and configured DNS. Everytime I reboot the server, resolv.conf got deleted and it created a new nsswitch.conf. I used below to configure both settings: # svccfg -s dns/client svc:/network/dns/client> setprop config/nameserver = (xx.xx.xx.aa... (1 Reply)
Discussion started by: flexihopper18
1 Replies

9. Web Development

Simple Vue.js Component to Redirect to External Web Page Using Vue Router

Vue Router has some quirks and on of the quirks is that it is not reliable when adding external links using the vue-router library. After struggling with many solutions, I have found that creating a simple Vue.js component like this one seems to work the best (so far): Component Example: ... (0 Replies)
Discussion started by: Neo
0 Replies

10. Web Development

Vue JS 2 Tutorial by The Net Ninja: A Recommended Vue.js Video Tutorial Series

A number of people have asked me how to get started with Vue.js and my reply before today was to Google "Vue.js". That has changed and my recommendation to anyone who wants to learn the fastest growing, easiest to learn and use Vue.js web dev framework is to watch this video tutorial series: ... (0 Replies)
Discussion started by: Neo
0 Replies
NPX(1)                                                             User Commands                                                            NPX(1)

NAME
npx - execute npm package binaries SYNOPSIS
npx [options] <command>[@version] [command-arg]... npx [options] [-p|--package <pkg>]... <command> [command-arg]... npx [options] -c '<command-string>' npx --shell-auto-fallback [shell] INSTALL
npm install -g npx DESCRIPTION
Executes <command> either from a local node_modules/.bin, or from a central cache, installing any packages needed in order for <command> to run. By default, npx will check whether <command> exists in $PATH, or in the local project binaries, and execute that. If <command> is not found, it will be installed prior to execution. Unless a --package option is specified, npx will try to guess the name of the binary to invoke depending on the specifier provided. All package specifiers understood by npm may be used with npx, including git specifiers, remote tarballs, local directories, or scoped pack- ages. If a full specifier is included, or if --package is used, npx will always use a freshly-installed, temporary version of the package. This can also be forced with the --ignore-existing flag. o -p, --package <package> - define the package to be installed. This defaults to the value of <command>. This is only needed for packages with multiple binaries if you want to call one of the other executables, or where the binary name does not match the package name. If this option is provided <command> will be executed as-is, without interpreting @version if it's there. Multiple --package options may be provided, and all the packages specified will be installed. o --no-install - If passed to npx, it will only try to run <command> if it already exists in the current path or in $prefix/node_mod- ules/.bin. It won't try to install missing commands. o --cache <path> - set the location of the npm cache. Defaults to npm's own cache settings. o --userconfig <path> - path to the user configuration file to pass to npm. Defaults to whatever npm's current default is. o -c <string> - Execute <string> inside an npm run-script-like shell environment, with all the usual environment variables available. Only the first item in <string> will be automatically used as <command>. Any others must use -p. o --shell <string> - The shell to invoke the command with, if any. o --shell-auto-fallback [<shell>] - Generates shell code to override your shell's "command not found" handler with one that calls npx. Tries to figure out your shell, or you can pass its name (either bash, fish, or zsh) as an option. See below for how to install. o --ignore-existing - If this flag is set, npx will not look in $PATH, or in the current package's node_modules/.bin for an existing ver- sion before deciding whether to install. Binaries in those paths will still be available for execution, but will be shadowed by any pack- ages requested by this install. o -q, --quiet - Suppressed any output from npx itself (progress bars, error messages, install reports). Subcommand output itself will not be silenced. o -n, --node-arg - Extra node argument to supply to node when binary is a node script. You can supply this option multiple times to add more arguments. o -v, --version - Show the current npx version. EXAMPLES
Running a project-local bin $ npm i -D webpack $ npx webpack ... One-off invocation without local installation $ npm rm webpack $ npx webpack -- ... $ cat package.json ...webpack not in "devDependencies"... Invoking a command from a github repository $ npx github:piuccio/cowsay ...or... $ npx git+ssh://my.hosted.git:cowsay.git#semver:^1 ...etc... Execute a full shell command using one npx call w/ multiple packages $ npx -p lolcatjs -p cowsay -c 'echo "$npm_package_name@$npm_package_version" | cowsay | lolcatjs' ... _____ < your-cool-package@1.2.3 > ----- ^__^ (oo)\_______ (__) )/ ||----w | || || Run node binary with --inspect $ npx --node-arg=--inspect cowsay Debugger listening on ws://127.0.0.1:9229/.... Specify a node version to run npm scripts (or anything else!) npx -p node@8 npm run build SHELL AUTO FALLBACK
You can configure npx to run as your default fallback command when you type something in the command line with an @ but the command is not found. This includes installing packages that were not found in the local prefix either. For example: $ npm@4 --version (stderr) npm@4 not found. Trying with npx... 4.6.1 $ asdfasdfasf zsh: command not found: asfdasdfasdf Currently, zsh, bash (>= 4), and fish are supported. You can access these completion scripts using npx --shell-auto-fallback <shell>. To install permanently, add the relevant line below to your ~/.bashrc, ~/.zshrc, ~/.config/fish/config.fish, or as needed. To install just for the shell session, simply run the line. You can optionally pass through --no-install when generating the fallback to prevent it from installing packages if the command is missing. For bash@>=4: $ source <(npx --shell-auto-fallback bash) For zsh: $ source <(npx --shell-auto-fallback zsh) For fish: $ source (npx --shell-auto-fallback fish | psub) ACKNOWLEDGEMENTS
Huge thanks to Kwyn Meagher https://blog.kwyn.io for generously donating the package name in the main npm registry. Previously npx was used for a Tessel board Neopixels library, which can now be found under npx-tessel https://npm.im/npx-tessel. AUTHOR
Written by Kat Marchan https://github.com/zkat. REPORTING BUGS
Please file any relevant issues on Github. https://github.com/zkat/npx LICENSE
This work is released by its authors into the public domain under CC0-1.0. See LICENSE.md for details. SEE ALSO
o npm(1) o npm-run-script(1) o npm-config(7) npx@10.1.1 April 2018 NPX(1)
All times are GMT -4. The time now is 08:09 AM.
Unix & Linux Forums Content Copyright 1993-2022. All Rights Reserved.
Privacy Policy