请参阅use-gulp-to-select-and-move-directories-and-their-files ,我将html文件从dist文件夹更改为root文件,但我不知道如何更改html文件中的捆绑文件路径
我使用了folulwing gulp任务来移动我的html文件
var filesToMove = [
'dist/index.html',
];
gulp.task('move', function(){
gulp.src(filesToMove, { base: './' })
.pipe(gulp.dest('./'));
});
这是我想要更改捆绑文件路径的位置
<link rel="shortcut icon" href="favicon.ico"><link href="app.e6b85da4b9b36d023c5e.css" rel="stylesheet"></head>
还有一个地方
<script type="text/javascript" src="polyfills.e6b85da4b9b36d023c5e.js"></script><script type="text/javascript" src="app.e6b85da4b9b36d023c5e.js"></script><script type="text/javascript" src="ts-file.e6b85da4b9b36d023c5e.js"></script></body>
**这是我的webpack文件。我给了我的dist文件文件kocation **
const webpack = require('webpack')
const webpackMerge = require('webpack-merge')
const CompressionPlugin = require('compression-webpack-plugin');
const UglifyJsPlugin = require('webpack/lib/optimize/UglifyJsPlugin')
const { AotPlugin } = require('@ngtools/webpack')
const commonConfig = require('./webpack.common.js')
const LoaderOptionsPlugin = require('webpack/lib/LoaderOptionsPlugin');
const helpers = require('./helpers')
const ENV = process.env.NODE_ENV = process.env.ENV = 'production'
module.exports = webpackMerge(commonConfig(), {
output: {
path: helpers.root('dist'),
filename: '[name].[hash].js',
chunkFilename: '[id].[hash].chunk.js'
},
plugins: [
new AotPlugin({
tsConfigPath: helpers.root('tsconfig-aot.json'),
entryModule: helpers.root('src', 'app', 'app.module#AppModule')
}),
new LoaderOptionsPlugin({
minimize: true,
debug: false,
options: {
htmlLoader: {
minimize: false
}
}
}),
new UglifyJsPlugin({
beautify: false,
output: {
comments: false
},
mangle: {
screw_ie8: true
},
compress: {
screw_ie8: true,
warnings: false,
conditionals: true,
unused: true,
comparisons: true,
sequences: true,
dead_code: true,
evaluate: true,
if_return: true,
join_vars: true,
negate_iife: false
},
}),
// new CompressionPlugin({
// asset: '[path].gz[query]',
// algorithm: 'gzip',
// test: /\.js$|\.css$|\.html$/,
// threshold: 10240,
// minRatio: 0.8
// }),
new webpack.DefinePlugin({
'process.env': {
'ENV': JSON.stringify(ENV)
}
})
]
})
&#13;
这是我常见的网络包文件
const webpack = require('webpack')
const ContextReplacementPlugin = require('webpack/lib/ContextReplacementPlugin')
const ExtractTextPlugin = require('extract-text-webpack-plugin')
const CopyWebpackPlugin = require('copy-webpack-plugin')
const HtmlWebpackPlugin = require('html-webpack-plugin')
const helpers = require('./helpers')
module.exports = () => {
const isProd = process.env.ENV === 'production'
return {
// Array of extensions that will be used to resolve modules
resolve: {
extensions: ['.ts', '.js', '.json'],
modules: [
helpers.root('src'),
helpers.root('node_modules')
],
},
// The entry point for the bundle
entry: {
'polyfills': helpers.root('src', 'polyfills.ts'),
'ts-file':[
helpers.root('src','app','common','samplelist.ts'),
helpers.root('src','app','common','shared.module.ts'),
helpers.root('src','app','app.module.ts')
],
'app': [
helpers.root('src', isProd ? 'main-aot.ts' : 'main-jit.ts'),
helpers.root('src', 'assets', 'styles', 'main.scss')
]
},
module: {
rules: [
// Compiles all .ts files
{
test: /\.ts$/,
use: ['awesome-typescript-loader?silent=true', 'angular2-template-loader'],
exclude: /\.spec\.ts$/
},
// Injects all html templates into their components and loads referenced assets
{
test: /\.html$/,
use: 'html-loader',
exclude: helpers.root('src', 'index.html')
},
// Copies all images and fonts into dist/assets
{
test: /\.(png|jpe?g|gif|svg|woff|woff2|ttf|eot)$/,
use: 'file-loader?name=assets/[name].[ext]'
},
// Puts all styles from assets/styles/main.scss in a separate file
{
test: /\.scss$/,
use: ExtractTextPlugin.extract(['css-loader', 'sass-loader']),
exclude: helpers.root('src', 'app')
},
// Injects all angular styles into their components
{
test: /\.scss$/,
use: ['raw-loader', 'sass-loader'],
include: helpers.root('src', 'app')
},
// To string and css loader support for *.css files (from Angular components)
{
test: /\.css$/,
use: ['to-string-loader', 'css-loader'],
include: helpers.root('node_modules')
},
// Loads all "required" json files into their components
{
test: /\.json$/,
use: 'json-loader'
}
]
},
plugins: [
// File name for the extracted styles
new ExtractTextPlugin(`[name]${isProd ? '.[hash]' : ''}.css`),
// Identifies common modules and puts them into a commons chunk
new webpack.optimize.CommonsChunkPlugin({
name: ['app', 'polyfills']
}),
// Provides context to Angular's use of System.import
// See: https://github.com/AngularClass/angular2-webpack-starter/issues/993#issuecomment-283423040
new ContextReplacementPlugin(
/angular(\\|\/)core(\\|\/)@angular/,
helpers.root('src')
),
// Generates a HTML5 file that includes all webpack bundles
new HtmlWebpackPlugin({
template: helpers.root('src', 'index.html'),
favicon: helpers.root('src', 'favicon.ico')
}),
// Copies all i18n files into dist/i18n
// new CopyWebpackPlugin([{
// from: helpers.root('src', 'i18n'),
// to: 'i18n'
// }]),
],
performance: {
hints: false
}
}
}
&#13;