【问题标题】:What is use of build:babel and build:sass?build:babel 和 build:sass 有什么用?
【发布时间】:2018-10-01 22:39:11
【问题描述】:
"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"


这两行是什么意思?

【问题讨论】:

    标签: reactjs sass babeljs node-sass


    【解决方案1】:

    我假设您已从某种 Node.js 样板项目(可能用于 React 开发)的 package.json 文件中获取这两行代码。他们定义了两个 npm 脚本。


    我不知道你对npm scripts 的熟悉程度,所以这里有一个简单的解释:

    当您在 Node.js 项目的开发过程中一遍又一遍地运行相同的命令并希望让您和协作者更轻松地运行该命令时,您可以通过将命令添加到"scripts" 文件中的 package.json 对象并为其命名。使用 npm 脚本还有一个好处是,当使用npm run <name> 运行脚本时,npm 会自动找到您在脚本中使用的包二进制文件的本地版本(通过包的dependenciesdevDependencies 安装)。


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

    此脚本运行babel-cli 并指示它到compile the entire src directory and output it to the build directory如果您还不知道,Babel 是一种将现代 JavaScript 编译为 JavaScript 的工具,它也与过时的浏览器(或运行时等)兼容。

    node-sass src/styles/index.scss --include-path node_modules -o build/styles --output-style compressed

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

    【讨论】:

      猜你喜欢
      • 1970-01-01
      • 2011-02-13
      • 2019-11-24
      • 2011-03-23
      • 2016-06-24
      • 2012-08-24
      • 2016-11-12
      • 1970-01-01
      • 1970-01-01
      相关资源
      最近更新 更多