Make sure the Enabled checkbox is selected.īy default, the File Watcher will be available in the current project. PhpStorm brings you back to the File Watchers page where the new File Watcher is added to the list: Otherwise, type the path manually or click and select the file location in the dialog that opens.Īccept the default File Watcher settings or reconfigure them, if necessary, as described in File Watchers, and click OK. If you installed UglifyJS through the Node Package Manager, PhpStorm locates the package itself and fills in the field automatically with the uglifyjs alias. In the Program text box, specify the location of the UglifyJS executable file. The File Watchers page that opens shows the list of already configured File Watchers.Ĭlick or press Alt+Insert and select the UglifyJS predefined template from the list.
In the Settings/Preferences dialog ( Ctrl+Alt+S), click File Watchers under Tools. Learn more from the UglifyJS official website. In the embedded Terminal ( Alt+F12), type: Make sure the File Watchers bundled plugin is enabled on the Settings/Preferences | Plugins page, tab Installed. Make sure the JavaScript and TypeScript bundled plugin is enabled on the Settings/Preferences | Plugins page, tab Installed. Make sure you have Node.js on your computer. To change this default presentation, configure file nesting in the Project tool window.
Minify js file code#
However, in the Project Tree, the file with the minified code is shown under the source JavaScript file which is displayed as a node. The location of this generated file is defined in the Output paths to refresh field of the New Watcher dialog. The generated minified code is stored in a separate file with the name of the source JavaScript file and the extension min.js. You can specify other events that invoke UglifyJS. To compress your code automatically, you need to configure a UglifyJS File Watcher which will track changes to your files and run UglifyJS.īy default, minification starts as soon as a JavaScript file in the File Watcher's scope is changed and saved. For ES6 and later versions, use build tools, for example, Babel or webpack. UglifyJS works only with JavaScript (ES5 and earlier). If you're not using build tools, you can use a stand-alone tool, such as UglifyJS. Most often compression is done as a step in your build process, with build tools like webpack.
At the production stage, they only increase the size of code to be transferred. During development and debugging, these characters make code easier to read. Oh yes, minifying could also remove comments.Minification or compression means removing all unnecessary characters, such as spaces, new lines, comments, without changing the functionality of the source code. If you don't want to give away your pristine source code with comments and all, minifying and obfuscating are both good tactics to use. Although there are other tools that can further obfuscate your code. If you depend on many other libraries, they can add up to many more lines of code and could enjoy the help of a minifier.Ī minifier can also obfuscate your code a little bit. But when you start to go into millions of lines of code, those gains get more noticeable.Īlso it has effects on your dependencies. With a small script it wouldn't matter much. The JavaScript parser used by the browsers could read the minified source code slightly faster. The Closure tools by Google seem more capable of going into more advanced minification levels. Sometimes they can tell exactly how variables are used then they could try to rename some of the variables to shorter names as well.ĭifferent tools provide different levels of minification. The least they can do is to remove the unnecessary white spaces. It depends on the settings used by the minifier.
0 kommentar(er)
