小编Dus*_*tin的帖子

本地库的 Webpack 外部配置

我想设置我的 Webpack 配置 (v4+) 以排除引用本地库的导入。在我的应用程序中,我像这样导入这个库:

/src/index.js

import foo from '../foo/foo'

console.log(foo);
Run Code Online (Sandbox Code Playgroud)

/foo/foo.js

export default foo = "bar";
Run Code Online (Sandbox Code Playgroud)

webpack.config.js

const path = require('path')
module.exports = {
    entry: './src/index.js',
    output: {
      filename: 'main.js',
      path: path.resolve(__dirname, 'dist')
    },
    externals: {
      "foo": path.resolve(__dirname, "./foo/foo"),
    }
  };
Run Code Online (Sandbox Code Playgroud)

然而,这个库实际上已经在我部署应用程序的站点中被全局引用。所以我不希望这个库与我的应用程序捆绑在一起(我仍然需要导入它,以便我可以毫无错误地转译我的打字稿并使用智能感知)。

我发现我可以通过利用 externals 属性轻松地将库排除在捆绑之外,如下所示:

module.exports = {
  externals: {
    "jquery": "jQuery"
  }
}
Run Code Online (Sandbox Code Playgroud)

我对正在导入的库做同样的事情没有成功。我该怎么做呢?我已尝试以下操作,该库仍然包含在我的捆绑包中:

我一直在研究文档,似乎只能找到与节点模块相关的示例,而没有任何特定于我的要求。

如果您需要任何其他详细信息,请告诉我。提前致谢!

javascript typescript webpack

7
推荐指数
1
解决办法
1万
查看次数

Bootstrap 列包装 - 不规则行为

我目前正在使用 Bootstrap 遇到不规则的列换行行为。包裹在我的行中的一些列浮动到容器的顶部,而不是前一个元素的下方。

根据 Bootstrap 文档:

如果在一行中放置超过 12 列,则每组额外的列将作为一个单元换行到一个新行。

例如,我有:

   <div class="container-fluid">

  <div class="row first">
    <div class="col-sm-6 col-md-3">
      Col 1
    </div>
    <div class="col-sm-6 col-md-3">
      Col 2
    </div>
    <div class="col-sm-6 col-md-3">
      Col 3
    </div>
    <div class="col-sm-6 col-md-3">
      Col 4
    </div>
    <div class="col-sm-6 col-md-4">
      Col 5
    </div>
    <div class="col-sm-6 col-md-4">
      Col 6
    </div>
    <div class="col-sm-12 col-md-4">
      Col 7
    </div>
  </div>
  <div class="panel panel-default">
    <div class="panel-body">
      Panel
    </div>
  </div>
</div>
Run Code Online (Sandbox Code Playgroud)

根据文档,最后一列的行为是我认为不正确的。当您在下面的例子中调整视在这里,你可以看到,第7列有对小视窗不规则行为。该列似乎填充了父元素的宽度/高度。

有没有开箱即用的方法来使用引导程序解决这个问题?感觉好像我忽略了标记,但此刻我正在斜视......

css grid-layout twitter-bootstrap

4
推荐指数
1
解决办法
6859
查看次数