Tag: browserify vueify

Vueify + Gulp：改进CSS处理

Vue的单文件模板语法为任务运行者创build了一个独特的难题，因为在单个文件中发现了两个单独的pipe道（JS和CSS）。 现在我知道使用Browserify的命令行工具，下面的工作： browserify -t vueify -p [ vueify/plugins/extract-css -o dist/app.css ] -e src/index.js | uglifyjs -o dist/app.js 这将创build两个输出文件： app.css和app.js ，并且在浏览器中加载时，按预期显示我的组件样式 现在我想改进这个输出。 正如您在示例中所看到的，我将生成的JS传递给uglifyjs – 在准备生产时将其uglifyjs 。 但是没有这样的转换应用于CSS。 它没有被缩小，不必要的CSS不被删除，自动前缀不被执行等等。 由于NPM脚本只允许你运行一个单一的命令，在我看来，像我想要的那样，在一个命令行指令中是不可能的。 我需要一个命令来提取CSS和另一个来修改它 – Grunt / Gulp风格。 这让我看到了在我的项目中使用Gulp。 使用Vueify的extract-css插件，我可以将这个CSS转储到文件中，如下所示： browserify('./main.js') .transform('vueify') .plugin('vueify/plugins/extract-css', { out: 'dist/bundle.css' }) .bundle() 这是直接从Vueify的文档 ，虽然他们提到，“也可以是一个可写的stream”，没有提供任何例子，这是什么意思，这个或如何做到这一点。 不过，这是我遇到第一个问题的地方。 这个小小的示例代码没有为我工作： const gulp = require("gulp"); const browserify = require("browserify"); […]