javascript - 将 browserify-css 与 grunt 一起使用

Question

我目前有 grunt-browserify 将一些 js 文件构建到一个包中。我正在尝试通过 require('./style.css') 将 css 添加到 bundle 中。我一直在研究一些选项来执行此操作，并找到了 browserify-css 库( https://www.npmjs.com/package/browserify-css )。但是没有 grunt 支持，所以我不确定如何将其添加到我现有的 grunt 设置中。

看来我需要添加 browserify-css 作为转换选项。 grunt-browserify 表示转换选项需要执行一系列任务(见下文)。但是，我不认为 browserify-css 可以写成一个繁重的任务。这种情况下的最佳做法是什么？

    browserify: {
        dist: {
            files: {
                'dist/bundle.js': 'js/index.js'
            }
        },
        transform: ['coffeify']
    }

Answer 1

我检查了browserify的源代码，找到了这个解决方案:

browserify: {
    dist: {
      src: 'js/index.js',
      dest: 'dist/bundle.js'
    },
    options: {
        transform: [['browserify-css', { global: true }]]
    }
}

当我需要从 node_modules 文件夹复制 css 文件时，这对我有用。为了让它工作，你只需要运行:

npm install browserify browserify-css grunt-browserify --save-dev

就是这样!