build:babel和build:sass的用途是什么? [英] What is use of build:babel and build:sass?

问题描述

"build:babel": "babel --ignore src/vendor --source-maps -d build src",
"build:sass": "node-sass src/styles/index.scss --include-path node_modules -o build/styles --output-style compressed"

这两行是什么意思?

推荐答案

我假设您已经从某种Node.js样板项目()的 package.json 文件中摘录了这两行(大概用于React开发).他们定义了两个npm脚本.

I assume that you've taken these two lines from the package.json file of some kind of Node.js boilerplate project (presumably for React development). They define two npm scripts.

我不知道您对 npm脚本的熟悉程度，因此这里有一个简短的解释:

I don't know how familiar you are with npm scripts in general, so here's a quick explanation:

当您在开发Node.js项目的过程中一次又一次地运行同一命令，并且希望使您和协作者更轻松地运行该命令时，可以通过将命令添加到以下命令来创建npm脚本: package.json 文件中的"scripts" 对象，并为其指定一个描述性名称.使用npm脚本还有一个优势，当使用 npm run< name ，npm会自动找到您在脚本中使用的软件包二进制文件的本地版本(通过软件包的 dependencies 或 devDependencies 安装)

When you are running the same command over and over again during the development of a Node.js project and want to make it easier for you and collaborators to run that command, you can create an npm script by adding the command to the "scripts" object in your package.json file and giving it a descriptive name. Using npm scripts also has the advantage that when running the script using npm run <name>, npm will automatically find the local version of the package binaries (installed through the package's dependencies or devDependencies) that you are using in the script.

babel --ignore src/vendor --source-maps -d build src

此脚本运行 babel-cli 并指示将其保存到编译整个 src 目录并将其输出到 build 目录.如果您还不了解， Babel 是将现代JavaScript编译为JavaScript的工具，还与过时的浏览器(或运行时等)兼容.

This script runs the babel-cli and instructs it to compile the entire src directory and output it to the build directory. If you don't know already, Babel is a tool to compile modern-day JavaScript to JavaScript that is also compatible with outdated browsers (or runtimes, etc.).

node-sass src/styles/index.scss --include-path node_modules -o build/styles-输出样式已压缩

此脚本运行 node-sass CLI并指示其编译 src/styles/index.scss 文件，并在查找 @import -时包含 node_modules 目录-ed文件，压缩输出，然后将编译后的CSS文件放入 build/css 中.如果您还不了解， Sass 是CSS的超集，它添加了诸如嵌套之类的有用功能

This scripts runs the node-sass CLI and instructs it to compile the src/styles/index.scss file, include the node_modules directory when looking for @import-ed files, compress the output and put the compiled CSS file into build/css. If you don't know already, Sass is a superset of CSS that adds useful features like nesting.

这篇关于build:babel和build:sass的用途是什么?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！