webowy projekt kątowy w produkcji - angularjs, caching, webpack, produkcja

Im jest za pomocą projektu kątowego Webpack i udało się wygenerować pakiet i wstrzyknąć go do pliku index.html.

Ale w przeglądarce widzę dodatek WebpackFOLDER na karcie źródłowej ze starym kodem, chyba że wyczyściłem pamięć podręczną przeglądarki i nie mogę znaleźć najnowszego kodu. Są jednak wygenerowane pakiety i style, ale moje strony nie pobierają tych plików, pobierają kod z folderu Webpack.

Im dołączam strukturę folderów, którą widzęprzeglądarka, U może zobaczyć folder kompilacji, z którego renderowany jest kod, a także folder, w którym najnowszy kod się nie aktualizuje, pomoc doceniona, Dzięki

================================================== == Webpack.development.config.js

const webpack = require("webpack");
const path = require("path");
const ExtractTextPlugin = require("extract-text-webpack-plugin");
const CleanWebpackPlugin = require("clean-webpack-plugin");
HtmlWebpackPlugin = require("html-webpack-plugin");
const nodeModulesPath = path.resolve(__dirname, "node_modules");
const buildPath = path.resolve(__dirname,"app/build");
const mainPath = path.resolve(__dirname, "app", "index.js");
const config = {
context:__dirname,
entry:  {
app:[
mainPath
],
vendors: ["jquery","angular"]
},
output:{
path:buildPath,
filename:"bundle.min.js",
publicPath: "http://website.oo.com/build/" // development
},
devtool: "source-map",
resolve:{
alias:{
jquery: "jquery/src/jquery"
},
extensions:["",".js",".css",".less",".html"]
},
module:{
loaders:[
{test: /.js$/,loader: "babel-loader",query:{presets: ["es2015"],compact: false},exclude: "/node_modules/"},
{test: /.less$/,loader:ExtractTextPlugin.extract(["css","less"]) },
{test: /.css$/,loader:ExtractTextPlugin.extract(["css"])},
{test: /.html$/,loader: "html?config=otherHtmlLoaderConfig"},
{test: /bootstrap/js//, loader:"imports?jQuery=jquery"},
{test: /.(png|woff|woff2|eot|ttf|svg)$/, loader:"url-loader",query:{limit:100000}},
{test: /.woff(2)?(?v=[0-9].[0-9].[0-9])?$/, loader: "url-loader?limit=10000&minetype=application/font-woff"},
{test: /.(ttf|eot|svg)(?v=[0-9].[0-9].[0-9])?$/, loader: "file-loader" },
{test: /[/\]node_modules[/\]some-module[/\]index.js$/,loader: "imports?this=>window"}
]
},
plugins: [
new webpack.ProvidePlugin({$: "jquery",jQuery: "jquery"}),
new webpack.HotModuleReplacementPlugin(),
new webpack.NoErrorsPlugin(),
new webpack.optimize.AggressiveMergingPlugin({minSizeReduce:1,moveToParents: true}),
new webpack.optimize.UglifyJsPlugin({compress: { warnings: false },comments:false,sourceMap:true,minimize: true}),
new ExtractTextPlugin("style.min.css", { allChunks: true }),
new webpack.optimize.CommonsChunkPlugin("vendors", "vendor.min.js"),
new CleanWebpackPlugin(["app/build"],{verbose: true,dry: false,exclude: ["vendor.min.js"],watch:false}),
new HtmlWebpackPlugin({
title: "Onepoint Global Account",
template:path.join(__dirname,"app","index.html"),
inject: "body"}),
]
};
module.exports = config;

================================================== ====== Package.json

"scripts": {
"local": "webpack-dev-server --content-base app",
"server": "node server",
"build": "set NODE_ENV=production && webpack -d --watch -p --config  webpack.development.config.js"
}

Używam polecenia "npm run build", aby rozpocząć projekt.

Odpowiedzi:

Aby odnieść się do dwóch punktów:

1. /build znajduje się w adresie URL z powodu tej linii:

   publicPath: "http://website.oo.com/build/" // development
   

   Twój buildPath to katalog, w którym możesz hostować swoją witrynę.

2. Czy masz webpack.prod.config.js? Możesz mieć tylko jeden plik konfiguracyjny, ale pamiętaj, że prowadzisz produkcję (set NODE_ENV=production, i -p) z konfiguracją programistyczną. Jeśli chcesz pokonać buforowanie przeglądarki, możesz określić skrót w pliku wynikowym:

   output: {
   ...
   filename:"bundle.[hash].min.js",
   },