为什么Heroku不构建和部署不更改dist文件夹

时间:2019-03-29 22:23:20

标签: node.js angular heroku package.json

MEAN项目中的以下技术存在问题-angular 7,webpack,nodejs,heroku。

我使用webpack设置了项目以进行开发和生产构建,但是当我将其推送到heroku时,似乎dist文件夹在部署后从未改变。

我尝试更改html&css代码,但浏览网站时未应用所有更改。 我检查了heroku构建并看到“ npm run build”成功。

附加了一些代码: package.json:

{
  "name": "Bla Bla",
  "version": "0.0.1",
  "license": "MIT",
  "scripts": {
    "ng": "ng",
    "test": "ng test",
    "lint": "ng lint",
    "e2e": "ng e2e",
    "dev": "node server.js",
    "start:dev": "npm run dev & webpack-dev-server --port=4200",
    "start": "npm run dev",
    "build": "cross-env NODE_ENV=production  --config webpack.config.js",
    "heroku-prebuild": "rm -rf dist"
  },
  "heroku-run-build-script": true,
  "private": true,
  "dependencies": {
    "@agm/core": "1.0.0-beta.5",
    "@angular/animations": "7.2.0",
    "@angular/cdk": "7.3.5",
    "@angular/common": "7.2.0",
    "@angular/compiler": "7.2.0",
    "@angular/compiler-cli": "7.2.10",
    "@angular/core": "7.2.0",
    "@angular/forms": "7.2.0",
    "@angular/http": "7.2.0",
    "@angular/material": "7.2.0",
    "@angular/platform-browser": "7.2.0",
    "@angular/platform-browser-dynamic": "7.2.0",
    "@angular/router": "7.2.0",
    "@nicky-lenaers/ngx-scroll-to": "0.6.1",
    "buffer": "5.2.1",
    "classlist.js": "1.1.20150312",
    "core-js": "2.5.4",
    "express": "4.16.4",
    "lodash": "4.17.11",
    "moment": "2.24.0",
    "ng-circle-progress": "1.0.0",
    "ngx-device-detector": "1.3.5",
    "path": "0.12.7",
    "rxjs": "6.3.3",
    "rxjs-compat": "6.4.0",
    "tslib": "1.9.0",
    "zone.js": "0.9.0"
  },
  "devDependencies": {
    "@angular-devkit/build-angular": "0.13.6",
    "@angular/cli": "7.3.6",
    "@angular/language-service": "7.2.0",
    "@ngtools/webpack": "7.3.6",
    "@types/googlemaps": "3.30.19",
    "@types/jasmine": "2.8.8",
    "@types/jasminewd2": "2.0.3",
    "@types/lodash": "4.14.123",
    "@types/node": "8.9.4",
    "@types/uuid": "3.4.4",
    "angular-router-loader": "0.8.5",
    "angular2-template-loader": "0.6.2",
    "awesome-typescript-loader": "5.2.1",
    "babel-core": "6.26.3",
    "babel-loader": "7.1.5",
    "babel-preset-env": "1.7.0",
    "clean-css-loader": "1.1.0",
    "clean-webpack-plugin": "2.0.1",
    "codelyzer": "4.5.0",
    "cross-env": "5.2.0",
    "css-loader": "2.1.1",
    "cssnano": "4.1.10",
    "enhanced-resolve": "3.4.1",
    "exports-loader": "0.7.0",
    "file-loader": "3.0.1",
    "html-loader": "0.5.5",
    "html-webpack-plugin": "3.2.0",
    "jasmine-core": "2.99.1",
    "jasmine-spec-reporter": "4.2.1",
    "karma": "4.0.1",
    "karma-chrome-launcher": "2.2.0",
    "karma-coverage-istanbul-reporter": "2.0.1",
    "karma-jasmine": "1.1.2",
    "karma-jasmine-html-reporter": "0.2.2",
    "mini-css-extract-plugin": "0.5.0",
    "node-sass": "4.11.0",
    "optimize-css-assets-webpack-plugin": "5.0.1",
    "protractor": "5.4.0",
    "sass-loader": "7.1.0",
    "style-loader": "0.23.1",
    "stylus-loader": "3.0.2",
    "to-string-loader": "1.1.5",
    "ts-node": "7.0.0",
    "tslint": "5.11.0",
    "typescript": "3.2.2",
    "uglifyjs-webpack-plugin": "2.1.2",
    "url-loader": "1.1.2",
    "webpack": "4.29.6",
    "webpack-cli": "3.3.0",
    "webpack-dev-server": "3.2.1",
    "webpack-merge": "4.2.1"
  },
  "engines": {
    "node": "10.15.3",
    "npm": "6.4.1"
  }
}

webpack.config.js:

const environment = (process.env.NODE_ENV || 'development').trim();
if (environment === 'development') {
    module.exports = require('./config/webpack.config.dev');
} else {
    module.exports = require('./config/webpack.config.prod');
}

比其对webpack.config.prod的调用:

const webpackMerge = require('webpack-merge');
const commonConfig = require('./webpack.config.common');
const path = require('path');
const ngw = require('@ngtools/webpack');
const UglifyJsPlugin = require('uglifyjs-webpack-plugin');
const OptimizeCSSAssetsPlugin = require('optimize-css-assets-webpack-plugin');
const cssnano = require('cssnano');
const helpers = require('./helpers');

module.exports = webpackMerge(commonConfig, {
  mode: 'production',
  devtool: 'source-map',
  output: {
    path: path.join(process.cwd(), "dist"),
    publicPath: '/',
    filename: '[name].bundle.js',
    chunkFilename: '[id].chunk.js',
  },
  optimization: {
    noEmitOnErrors: true,
    splitChunks: {
        chunks: 'all'
    },
    runtimeChunk: 'single',
    minimizer: [
        new UglifyJsPlugin({
            cache: true,
            parallel: true
        }),
         new OptimizeCSSAssetsPlugin({
             cssProcessor: cssnano,
             cssProcessorOptions: {
                 discardComments: {
                     removeAll: true
                 }
             },
             canPrint: false
         })
    ]
  },
  module: {
    rules: [
      {
        test: /(?:\.ngfactory\.js|\.ngstyle\.js|\.ts)$/,
        loader: '@ngtools/webpack'
      },
    ]
  },
  plugins: [
    new ngw.AngularCompilerPlugin({
        tsConfigPath: helpers.root('tsconfig.json'),
        entryModule: helpers.root('src', 'app', 'app.module#AppModule'),
        skipCodeGeneration: false,
        sourceMap: true,
    })  
  ]
});

我希望当静态文件发生更改时,部署将更改网站内容。

0 个答案:

没有答案