在我的企业共享 npm 包中处理依赖项的路径答案

【问题标题】：Handle path from dependency in my entrerprise shared npm package在我的企业共享 npm 包中处理依赖项的路径
【发布时间】：2019-02-04 18:01:49
【问题描述】：

我的公司有一个共享包，它具有引导程序作为依赖项，结构如下所示：

+ - my-library
    + - node_modules
      + ...
      + bootstrap
        + scss
          --_mixins.scss
          --_functions.scss
          --_variables.scss
          --_buttons.scss
    +-scss
      -- _buttons.scss
      -- main.scss 
    package.json

这个库的想法将在很多团队中使用。我的图书馆的主要文件：

package.json

{
  "name": "my-library",
  "version": "1.0.0",
  "description": "",
  "scripts": {
    "dev": "node-sass sass/index.scss --watch --output css"
  },
  "author": "",
  "license": "ISC",
  "dependencies": {
    "bootstrap": "^4.1.2"
  },
  "devDependencies": {
    "node-sass": "^4.9.2"
  }
}

scss/_buttons.scss

@import "./node_modules/bootstrap/scss/_mixins";
@import "./node_modules/bootstrap/scss/_functions";
@import "./node_modules/bootstrap/scss/_variables";
@import "./node_modules/bootstrap/scss/_buttons";

... THE CSS RULES FOR THE BUTTONS OF THE COMPANY ...

scss/main.scss

@import "_buttons";
... THE CSS RULES FOR GENERAL STYLES OF THE COMPANY ...

问题是当另一个项目使用我的库时。当有人做npm install --save my-library 时，为 get bootstrap 定义的路径是不同的，因为 bootstrap 现在是一个向后的文件夹。

+ - consumer-project

  + - node_modules
     + ...
     + bootstrap
       + scss
         --_mixins.scss
         --_functions.scss
         --_variables.scss
         --_buttons.scss
      + - my-library
        +-scss
          -- _buttons.scss
          -- main.scss 
        package.json

如果消费者项目导入main.scss文件，这将失败，因为现在_buttons.scss文件中的引导路径现在是../node_modules/bootstrap/

我的问题是： 处理我的库的依赖路径的正确方法是什么？

【问题讨论】：

sass/index.scss 在哪里？您的意思是指 scss/main.scss 吗？此外，在第二个文件/文件夹结构中，+ - my-library 似乎在 bootstrap 内部。你打算把它放在node_modules 对吗？

标签： npm sass bootstrap-4 shared-libraries

【解决方案1】：

假设my-library 位于node-modules 中，请使用--include-path 选项来引用./node_modules/，这将使node-sass 在编译scss 文件时能够找到引导程序。

在package.json中的命令中添加--include-path选项...

"scripts": {
    "dev": "node-sass --include-path ./node_modules/ sass/index.scss -o --watch --output css"
 },

【讨论】：