gpt4 book ai didi

javascript - 我怎样才能从这个项目中删除 bower 并将 requirejs 与 yarn (noob) 一起使用?

转载 作者:行者123 更新时间:2023-11-29 23:31:39 24 4
gpt4 key购买 nike

如何切换它以避免使用 Bower?

我是第一次安装 yeoman,knockoutjs 的生成器使用的是 bower。现在我读到 bower 支持是有限的,bootstrap 使用 popper.js,它在 v2 中将弃用对 bower 的支持。我想避免现在的头痛,同时学习。

RequireJS 和每个客户端库都在 /src/bower_modules 中。

如果我使用 npm 或 yarn 安装 bootstrap,它会将它们安装在 /node_modules 中,浏览器无权访问。然后我是否使用 gulp 将 dist 文件夹传输到我的 /src/bower_modules 文件夹?

文件夹结构:

/src/
|--bower_modules/
|--app/
|--require.config.js
/node_modules/
/gulpfile.js

gulpfile.js:

var requireJsRuntimeConfig = vm.runInNewContext(fs.readFileSync('src/app/require.config.js') + '; require;'),
requireJsOptimizerConfig = merge(requireJsRuntimeConfig, {
out: 'scripts.js',
baseUrl: './src',
name: 'app/startup',
paths: {
requireLib: 'bower_modules/requirejs/require'
},
include: [
'requireLib',
'components/nav-bar/nav-bar',
'components/home-page/home',
'text!components/about-page/about.html'
],
insertRequire: ['app/startup'],
bundles: {
// If you want parts of the site to load on demand, remove them from the 'include' list
// above, and group them into bundles here.
// 'bundle-name': [ 'some/module', 'another/module' ],
// 'another-bundle-name': [ 'yet-another-module' ]
}
}),
transpilationConfig = {
root: 'src',
skip: ['bower_modules/**', 'app/require.config.js'],
babelConfig: {
modules: 'amd',
sourceMaps: 'inline'
}
},
babelIgnoreRegexes = transpilationConfig.skip.map(function(item) {
return babelCore.util.regexify(item);
});

应用/require.config.js:

var require = {
baseUrl: ".",
paths: {
"bootstrap": "bower_modules/bootstrap/js/bootstrap.min",
"crossroads": "bower_modules/crossroads/dist/crossroads.min",
"hasher": "bower_modules/hasher/dist/js/hasher.min",
"popper": "bower_modules/popper.js/dist/popper",
"jquery": "bower_modules/jquery/dist/jquery",
"knockout": "bower_modules/knockout/dist/knockout",
"knockout-projections": "bower_modules/knockout-projections/dist/knockout-projections",
"signals": "bower_modules/js-signals/dist/signals.min",
"text": "bower_modules/requirejs-text/text"
},
shim: {
"bootstrap": { deps: ["popper", "jquery"] }
}
};

旁注:问题的根源是我需要 popper 进行引导,而 bootstrasp.bundle 似乎不包含在 bower 版本中。此外,popper 不太喜欢 bower,并且不会长期支持。我也有多个错误试图包括它。我也想学习好的方法,因为 bower 不会存在很长时间,所以我不介意根本不使用它。

最佳答案

Bower 自己最近发布了一篇关于此的博客:https://bower.io/blog/2017/how-to-migrate-away-from-bower/ .以下是要点:

  1. 手动将所有包从 bower.json 移动到 package.json,这些包可从 Bower 和 NPM 获得
  2. 对于只能通过 Bower 获得的任何项目,您可以使用 bower-away NPM 包用于安装那些使用 NPM 而不是 Bower 的包
  3. 编写任务运行器脚本(Grunt/Gulp/等...)将包文件移动到您的dist 目录

像这样的东西应该可以做到。

gulp.task('injectNpmPackages', function () {
返回 gulp.src([
path.join('/node_modules/my-package/build/my-package.min.js')
])
.pipe(gulp.dest('/dist/vendor/'));
});

关于javascript - 我怎样才能从这个项目中删除 bower 并将 requirejs 与 yarn (noob) 一起使用?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/47106107/

24 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com