Bower tự định nghĩa mình là một trình quản lý gói trình duyệt và đây là một công cụ mạnh mẽ để quản lý các tài sản dự án của bạn: javascript, CSS và hình ảnh.
Cảnh báo: bài đăng này đã cũ và có thể không phản ánh tình trạng hiện tại của nghệ thuật
Bowertự định nghĩa mình là trình quản lý gói trình duyệt và đây là một công cụ mạnh mẽ để quản lý các tài sản dự án của bạn:JavaScript, CSS và hình ảnh. Ở đây tôi sẽ chỉ nói về JavaScript vì nó là trường hợp sử dụng chính của tôi.
Hãy bắt đầu, cài đặt nó.
npm install bower -g
Bây giờ, hãy tạo tệp .bowerrc trong thư mục gốc của bạn (nơi bạn sẽ gọi bower) hoặc trong thư mục chính của bạn và thêm một số tùy chỉnh: ví dụ ở đây, chúng tôi yêu cầu bower cài đặt các gói trong thư mục con javascript / components và sử dụng một tệp có tên 'bower.json' để lưu trữ dữ liệu của nó.
{
"directory" : "javascript/components",
"json" : "bower.json"
}The bower.json file is the same thing as the package.json file for npm packages in Node.js, except it’s for assets.
Let’s start by adding to your project something popular: jQuery.
You can install it by typing
bower install --save jquery
And by referencing the newly installed package in your HTML code:
<script src="javascript/components/jquery/jquery.js"></script>
The –save option tells bower to add the entry to the bower.json file, so it will be easy to recreate the same packages structure later, just like with NPM in Node.js.
Once this package is installed, it’s super easy to jump to a newer jQuery release:
bower update jquery
The bower project maintains a list of popular packages on their servers so you can install them easily. Here you can find a list of them, ordered by popularity.
Of course there are thousands of projects not included, and you can install every git-powered software by using the git:// protocol, like:
bower install git://github.com/desandro/masonry
or just any path
bower install http://foo.com/jquery.awesome-plugin.js
Bower is smart enough to install a specific tag or commit of a package you’re interested in, if you need a previous version for compatibility or you don’t need to upgrade to a newer package:
bower install git://github.com/components/jquery.git#~1.8.1
Uninstalling a packages is simple as well:
bower uninstall jquery
I really like using Bower especially when it comes to upgrade dependencies from time to time, instead of wandering across multiple Github projects (when we’re lucky enough to have a Github page), a simple bower update
will take care of everything, except making sure everything still works on your project. That’s our job :-)
More devtools tutorials:
- Introduction to Yeoman
- Bower, the browser package manager
- Introduction to Frontend Testing
- Using node-webkit to create a Desktop App
- VS Code: use language-specific settings
- Introduction to Webpack
- A short and simple guide to Babel
- An introduction to Yarn
- Overview of the Browser DevTools
- Format your code with Prettier
- Keep your code clean with ESLint
- A list of cool Chrome DevTools Tips and Tricks
- Testing JavaScript with Jest
- How to use Visual Studio Code
- Introduction to Electron
- Parcel, a simpler webpack
- An Emmet reference for HTML
- The V8 JavaScript Engine
- Configuring VS Code
- Configuring the macOS command line
- How to disable an ESLint rule
- How to open VS Code from the command line
- How to set up hot reload on Electron