标签: bundling-and-minification

我正在测试驱动 rollupjs将一个节点应用程序打包成一个bundle.js并且很困惑。

rollup 是否支持捆绑完整的节点应用程序（包括node_modules），或者只是作为项目一部分的 js 文件？

我有一个标准的节点项目（1 个index.js，中的数千个文件node_modules）并且只想要一个bundle.js. 我试过：

汇总.config.js：

import commonjs from 'rollup-plugin-commonjs';
import nodeResolve from 'rollup-plugin-node-resolve';

export default {
entry: 'index.js',
dest: 'bundle.js',
format: 'iife',
plugins: [

    commonjs({
        // non-CommonJS modules will be ignored, but you can also
        // specifically include/exclude files
        include: 'node_modules/**',  // Default: undefined

        // if true then uses of `global` won't be dealt with by this plugin
        ignoreGlobal: false,  // Default: …

有谁知道是否可以使用Microsoft.Web.Optimization捆绑和缩小WebForms App_Themes？

据我所知,答案是否定的.我看到的问题来自课堂上的Include(params string[])方法System.Web.Optimization.Bundle.在内部调用System.Web.Optimization.IncludeDirectory(string, string, bool),然后使用此代码:

DirectoryInfo directoryInfo = new DirectoryInfo(
    HttpContext.Current.Server.MapPath(directoryVirtualPath));

虽然可以HttpContext.Current在单元测试期间设置,但我无法弄清楚如何使其.Server.MapPath(string directoryVirtualPath)返回非空字符串.由于DirectoryInfo(string)构造函数在传递null参数时抛出异常,因此这样的测试将始终失败.

.NET团队对此有何建议？我们是否必须将捆绑配置作为集成测试或用户验收测试的一部分进行单元测试？

我有一个动态生成Javascript的网站.生成的代码描述了类型元数据和一些服务器端常量,以便客户端可以轻松使用服务器的服务 - 因此它可以缓存.

生成的Javascript由ASP.NET MVC控制器提供服务; 所以它有一个Uri; 说~/MyGeneratedJs.

我想将这个Javascript包含在Javascript包中,包含其他静态Javascript文件(例如jQuery等):所以就像静态文件一样,我希望它在调试模式下单独引用,并在与非其他文件捆绑的缩小形式中引用调试模式.

如何在捆绑中包含动态生成的Javascript？

具体来说,我正在尝试使用已经缩小的脚本在MVC 4中创建ScriptBundle,并返回相同的Bundle,无论项目是否在Debug中.

我的Web项目引用了MVC Telerik Grid NuGet包.在该软件包中,Telerik仅提供缩小的JS文件.捆绑代码如下.

        // telerik scripts
        bundles.Add(new ScriptBundle("~/scripts/bundles/telerik").Include(
            "~/Scripts/2012.1.214/telerik.common.min.js",
            "~/Scripts/2012.1.214/telerik.textbox.min.js",
            "~/Scripts/2012.1.214/telerik.calendar.min.js",
            "~/Scripts/2012.1.214/telerik.datepicker.min.js",
            "~/Scripts/2012.1.214/telerik.grid.min.js",
            "~/Scripts/2012.1.214/telerik.grid.filtering.min.js"));

其他ScriptBundles运行正常,但是当我的项目尝试引用此包时,请求显示为:scripts/bundles/telerik?v= 什么都不返回.

如果我设置BundleTable.EnableOptimizations = true,那么它会返回ScriptBundle并引用特定版本,但是这个解决方案是不可接受的.

我不想强行设置BundleTable.EnableOptimizations = true,因为我希望所有其他Bundles在适当的时候返回非缩小版本.

任何人都有类似的经历,如果有,解决方案是什么？

我正在使用一些动态捆绑,它根据配置添加CSS和JS文件.

我启动了一个新的StyleBundle,这样:

var cssBundle = new StyleBundle("~/bundle/css");

然后循环通过配置并添加任何找到的包括:

cssBundle.Include(config.Source);

循环之后,我想检查是否包含任何文件/目录.我知道有EnumerateFiles(),但我不认为这100%是为了这个目的.

其他人以前做过类似的事吗？

我正在尝试使用Microsoft的Web优化框架呈现JavaScript包,如下所示:

@Scripts.Render("~/assets/bundle.js")

并建立一个小包,像这样:

public static void RegisterBundles(BundleCollection bundles)
{
    bundles.Add(new ScriptBundle("~/assets/bundle.js")
        .Include(
            "~/scripts/jquery-2.1.0.min.js",
            "~/scripts/somescript.js"
        ));

    ...
}

但是当启用优化时,它只会呈现相对URL,如下所示:

<script src="/assets/bundle.js?v=mGDOiNaiTrSfcNq41OoA7A_BcN8PrXuMbfl-TE84HVY1"></script>

如何让脚本捆绑呈现绝对URL呢？ 我找不到一种方法来查看MSDN上的文档.这是我最终会喜欢的:

<script src="http://my.site.com/assets/bundle.js?v=mGDOiNaiTrSfcNq41OoA7A_BcN8PrXuMbfl-TE84HVY1"></script>

这是在框架中,还是我必须使用辅助方法Script.Url？

我正在从我的网站记录javascript错误,但文件被最小化,所以我没有得到有意义的行号.不过,我确实有源地图.

是否有服务,脚本,npm模块或任何可以帮助我将缩小版本中的行号"翻译"为有用的东西？

TL; DR

minifyify(Browserify插件)使用uglify -js但似乎无法处理条件编译:

• 压缩工作
• uglifyjs单独适用于条件编译
• minifyify提供了额外的编译优化,但我无法使用条件编译

我正在使用Browserify与babelify变换器和minifyify插件.这是cmd,在可读部分细分:

browserify src/scripts/app/index.js -o build/prod/public/assets/js/appBundle.min.js -t [ babelify --presets [ es2015 ] ] -p [ minifyify --no-map --uglify [ --compress [ --drop_console --dead_code --conditionals --unused --if_return ] --mangle --screw-ie8 --define [ DEBUG=false ] ] ]

我已经获得了所有设置/选项.但是,我无法使条件编译工作.Minifyify使用uglifyjs的minify方法.我通过minifyify的事实不应该真正改变任何事情.

直接通过uglifyjs建立工程

uglifyjs input.js --compress --dead_code --define DEBUG=false -o output.js

但是我失去了minifyify提供的额外压缩/优化.

我也对另一个构建过程持开放态度.我的需求在当前流程的设置中恢复:

• CommonJS需要模块
• 将ES6转换为ES5
• 先进的缩小/压缩

我有一个 Nestjs 应用程序，我需要将它与 webpack 捆绑在一起。捆绑包应包含整个脚本和所有文件。所以我创建了我的 webpack 配置：

const webpack = require('webpack');
const path = require('path');

module.exports = {
  entry: {
    backend: './src/index.ts',
  },
  target: 'node',
  module: {
    rules: [
      {
        test: /.ts$/,
        use: 'ts-loader',
      },
      {
        test: /\.(graphql|gql)$/,
        exclude: /node_modules/,
        loader: 'webpack-graphql-loader',
      },
      {
        test: /\.mjs$/,
        include: /node_modules/,
        type: "javascript/auto",
      }
    ],
  },
  externals: ['fsevents'],
  mode: 'production',
  resolve: {
    extensions: ['.ts', '.mjs', '.js', '.json'],
  },
  output: {
    path: path.join(__dirname, 'bundled'),
    library: 'handler',
    libraryTarget: "commonjs2"
  },
  plugins: [
    new webpack.IgnorePlugin({
      checkResource(resource) …