最新消息: 电脑我帮您提供丰富的电脑知识,编程学习,软件下载,win7系统下载。

初始生产版本创建捆绑软件代码,但所有后续构建都重复使用旧捆绑软件

IT培训 admin 9浏览 0评论

初始生产版本创建捆绑软件代码,但所有后续构建都重复使用旧捆绑软件

在向我的项目添加了带有通行证和redux的身份验证之后,每当我将生产就绪代码推送到服务器时,它都会重复使用旧版本的捆绑文件。如果我使用的是一台服务器,但该服务器具有较旧的项目版本,则它将创建一个新的捆绑包,但后续的推送都不会。

起初我以为可能根本没有运行webpack,所以我在启动脚本中添加了一个特定的调用,并将依赖项从devDependencies移开了。即使从服务器上可以看到Web Pack正在运行和构建,这最终也没有任何改变。以下是我在package.json和webpack.config中设置的脚本。

// Package.json

"scripts": {
    "start": "npm-run-all --parallel build:prod lift",
    "dev": "webpack --mode development && sails lift",
    "start:debug": "npm-run-all --parallel open:client debug",
    "open:client": "webpack-dev-server --mode development --open",
    "build": "npm run build:prod",
    "build:dev": "webpack --mode development",
    "build:prod": "webpack --mode production"
}

// Webpack.config.js

const HtmlWebpackPlugin = require("html-webpack-plugin");

module.exports = {
  entry: {
    entry: "./assets/src/index.js"
  },
  output: {
    path: __dirname + "/.tmp/public",
    filename: "bundle.js",
    publicPath: "/"
  },
  module: {
    rules: [
      {
        use: "babel-loader",
        test: /\.js$/,
        exclude: /node_modules/
      },
      {
        use: ["style-loader", "css-loader"],
        test: /\.css$/
      }
    ]
  },

  plugins: [
    new HtmlWebpackPlugin({
      template: "assets/src/index.html"
    })
  ]
};

我知道我尚未采用最佳实践来生产Webpack,但现在我只想使其在我的服务器上工作。我的下一步是对生产的webpack进行微调,以使我的文件包文件尽可能最小,但是现在我需要使webpack重新打包资产,而不是使用旧文件。我是前端和后端javascript开发的新手,所以很多新手对我来说都是新手,我刚开始尽可能快地设置了webpack。

回答如下:

您需要在重新捆绑新的构建文件夹之前删除旧的构建文件夹。在包装前添加一个prepare npm挂钩以执行脚本

"scripts": {
    "prepare": "rm -rf /.tmp/public",
    "start": "npm-run-all --parallel build:prod lift",
    "dev": "webpack --mode development && sails lift",
    "start:debug": "npm-run-all --parallel open:client debug",
    "open:client": "webpack-dev-server --mode development --open",
    "build": "npm run build:prod",
    "build:dev": "webpack --mode development",
    "build:prod": "webpack --mode production"
}

"scripts": {
    "clean": "rm -rf /.tmp/public",
    ...
    "build": "npm run clean && npm run build:prod",
    "build:dev": "webpack --mode development",
    "build:prod": "webpack --mode production"
}

初始生产版本创建捆绑软件代码,但所有后续构建都重复使用旧捆绑软件

在向我的项目添加了带有通行证和redux的身份验证之后,每当我将生产就绪代码推送到服务器时,它都会重复使用旧版本的捆绑文件。如果我使用的是一台服务器,但该服务器具有较旧的项目版本,则它将创建一个新的捆绑包,但后续的推送都不会。

起初我以为可能根本没有运行webpack,所以我在启动脚本中添加了一个特定的调用,并将依赖项从devDependencies移开了。即使从服务器上可以看到Web Pack正在运行和构建,这最终也没有任何改变。以下是我在package.json和webpack.config中设置的脚本。

// Package.json

"scripts": {
    "start": "npm-run-all --parallel build:prod lift",
    "dev": "webpack --mode development && sails lift",
    "start:debug": "npm-run-all --parallel open:client debug",
    "open:client": "webpack-dev-server --mode development --open",
    "build": "npm run build:prod",
    "build:dev": "webpack --mode development",
    "build:prod": "webpack --mode production"
}

// Webpack.config.js

const HtmlWebpackPlugin = require("html-webpack-plugin");

module.exports = {
  entry: {
    entry: "./assets/src/index.js"
  },
  output: {
    path: __dirname + "/.tmp/public",
    filename: "bundle.js",
    publicPath: "/"
  },
  module: {
    rules: [
      {
        use: "babel-loader",
        test: /\.js$/,
        exclude: /node_modules/
      },
      {
        use: ["style-loader", "css-loader"],
        test: /\.css$/
      }
    ]
  },

  plugins: [
    new HtmlWebpackPlugin({
      template: "assets/src/index.html"
    })
  ]
};

我知道我尚未采用最佳实践来生产Webpack,但现在我只想使其在我的服务器上工作。我的下一步是对生产的webpack进行微调,以使我的文件包文件尽可能最小,但是现在我需要使webpack重新打包资产,而不是使用旧文件。我是前端和后端javascript开发的新手,所以很多新手对我来说都是新手,我刚开始尽可能快地设置了webpack。

回答如下:

您需要在重新捆绑新的构建文件夹之前删除旧的构建文件夹。在包装前添加一个prepare npm挂钩以执行脚本

"scripts": {
    "prepare": "rm -rf /.tmp/public",
    "start": "npm-run-all --parallel build:prod lift",
    "dev": "webpack --mode development && sails lift",
    "start:debug": "npm-run-all --parallel open:client debug",
    "open:client": "webpack-dev-server --mode development --open",
    "build": "npm run build:prod",
    "build:dev": "webpack --mode development",
    "build:prod": "webpack --mode production"
}

"scripts": {
    "clean": "rm -rf /.tmp/public",
    ...
    "build": "npm run clean && npm run build:prod",
    "build:dev": "webpack --mode development",
    "build:prod": "webpack --mode production"
}
发布评论

评论列表 (0)

  1. 暂无评论