Question

我知道如何使用npm来安装和维护构建工具，但是我意识到我不确定如何利用npm来安装框架（css或js，我通常只是在索引中拍打脚本/ css链接。 html）。

但是，假设我要使用npm。我已经运行过npm install bootstrap和npm install jquery，但是我不确定下一步是什么。

然后我只能说<link rel="stylesheet" type="text/css" href="nodemodules/boostrap/dist/css/bootstrap.css">，但这似乎很笨拙。

我看到很多人都用require('bootstrap');来导入这样的内容，但老实说，我什至不知道该放在哪里。

有人可以帮我填补这些空白吗？

Answer 1

一种常见的处理方法是通过grunt任务，该任务会将相关文件从node_modules中复制到一个更合适的文件夹中。

这是我用于最近项目的复制任务的摘录...

    copy: {
        types: {
            files: [
                {
                    expand: true,
                    cwd: 'node_modules/@types',
                    src: ['**/*.ts'],
                    dest: 'scripts/typings'
                }
            ]
        },
        jquery: {
            files: [
                {
                    expand: true,
                    cwd: 'node_modules/jquery/dist',
                    src: ['*.js'],
                    dest: 'Content/libraries/jquery'
                }
            ]
        },
        handlebars: {
            files: [
                {
                    expand: true,
                    cwd: 'node_modules/handlebars/dist',
                    src: ['*.js'],
                    dest: 'Content/libraries/handlebars'
                }
            ]
        },
        bootstrap: {
            files: [
                {
                    expand: true,
                    cwd: 'node_modules/bootstrap',
                    src: ['dist/js/*.js', 'dist/fonts/*.*', 'dist/css/*.css'],
                    dest: 'Content/libraries/bootstrap'
                }
            ]
        }
    }

也许有更多简洁的方法可以写出来，但这对我有用。

这使我可以通过执行以下操作来更新网站软件包...

$ npm install
$ grunt copy

文件夹/ Content / libraries和/ scripts / typings都提交给我的应用程序git repo，而node_modules不是。如果某个模块在将来的某个阶段变得不可用，这有助于防止出现问题。我的git仓库包含网站正常运行所需的一切。

如果出于某些原因从npm中删除了这些模块之一，那仅意味着我无法进行升级，但是我的网站仍可以使用git repo包含的文件。

就我而言，在我的运行时环境中实际上根本不需要node_modules，因为我没有使用nodejs。我只是使用npm来管理我的应用程序的客户端模块依赖性。

使用NPM安装Bootstrap

1 个答案: