Warning: file_get_contents(/data/phpspider/zhask/data//catemap/1/vue.js/6.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
`npm运行生成`不生成` index.html`_Npm_Vue.js - Fatal编程技术网

`npm运行生成`不生成` index.html`

`npm运行生成`不生成` index.html`,npm,vue.js,Npm,Vue.js,在我的Vue.JS项目中,运行以下命令后: npm run build dist目录中没有index.html文件: 我的webpack.base.config.js文件是: const path = require('path'); const webpack = require('webpack'); const ExtractTextPlugin = require('extract-text-webpack-plugin'); module.exports = { entry

在我的Vue.JS项目中,运行以下命令后:

npm run build 
dist目录中没有
index.html
文件:

我的
webpack.base.config.js文件是:

const path = require('path');
const webpack = require('webpack');
const ExtractTextPlugin = require('extract-text-webpack-plugin');

module.exports = {
  entry: {
    main: './src/main',
    vendors: './src/vendors'
  },
  output: {
    path: path.join(__dirname, './dist')
  },
  module: {
    rules: [
      {
        test: /.vue$/,
        use: [{
          loader: 'vue-loader',
          options: {
            loaders: {
              less: ExtractTextPlugin.extract({
                use: ['css-loader?minimize', 'autoprefixer-loader', 'less-loader'],
                fallback: 'vue-style-loader'
              }),
              css: ExtractTextPlugin.extract({
                use: ['css-loader', 'autoprefixer-loader', 'less-loader'],
                fallback: 'vue-style-loader'
              })
            }
          }
        },
          {
            loader: 'iview-loader',
            options: {
              prefix: false
            }
          }
        ]
      },
      {
        test: /iview\/.*?js$/,
        loader: 'babel-loader'
      },
      {
        test: /\.js$/,
        loader: 'babel-loader',
        exclude: /node_modules/
      },
      {
        test: /\.css$/,
        use: ExtractTextPlugin.extract({
          use: ['css-loader?minimize', 'autoprefixer-loader'],
          fallback: 'style-loader'
        })
      },
      {
        test: /\.less$/,
        use: [{
          loader: "style-loader" // creates style nodes from JS strings
        }, {
          loader: "css-loader" // translates CSS into CommonJS
        }, {
          loader: "less-loader" // compiles Less to CSS
        }]
      },
      {
        test: /\.(gif|jpg|png|woff|svg|eot|ttf)\??.*$/,
        loader: 'url-loader?limit=1024'
      },
      {
        test: /\.(html|tpl)$/,
        loader: 'html-loader'
      }
    ]
  },
  resolve: {
    extensions: ['.js', '.vue'],
    alias: {
      'vue': 'vue/dist/vue.esm.js',
      '@': path.resolve('src')
    }
  }
};
我的
webpack.prod.config.js
代码如下:

const webpack = require('webpack');
const HtmlWebpackPlugin = require('html-webpack-plugin');
const ExtractTextPlugin = require('extract-text-webpack-plugin');
const merge = require('webpack-merge');
const webpackBaseConfig = require('./webpack.base.config.js');
const fs = require('fs');

fs.open('./src/config/env.js', 'w', function (err, fd) {
  const buf = 'export default "production";';
  fs.write(fd, buf, 0, buf.length, 0, function (err, written, buffer) {
  });
});

module.exports = merge(webpackBaseConfig, {
  output: {
    publicPath: '/dist/',
    filename: '[name].[hash].js',
    chunkFilename: '[name].[hash].chunk.js'
  },
  plugins: [
    new ExtractTextPlugin({
      filename: '[name].[hash].css',
      allChunks: true
    }),
    new webpack.optimize.CommonsChunkPlugin({
      name: 'vendors',
      filename: 'vendors.[hash].js'
    }),
    new webpack.DefinePlugin({
      'process.env': {
        NODE_ENV: '"production"'
      }
    }),
    new webpack.optimize.UglifyJsPlugin({
      compress: {
        warnings: false
      }
    }),
    new HtmlWebpackPlugin({
      filename: '../index_prod.html',
      template: './src/template/index.ejs',
      inject: false
    })
  ]
});

编辑-1

$ npm run build

> wx_backup@1.0.0 build /Users/lkl/Desktop/my-project/web/wx_backup
> webpack --progress --hide-modules --config webpack.prod.config.js

您的
webpack.output.path
配置是
dist
目录

HTMLWebpackPlugin.filename
dist
目录相关。指定的文件名将把HTML文件保存在
dist
上方的目录中

如果希望html文件保存在
dist
目录中,请尝试改用
/index\u prod.html

new HtmlWebpackPlugin({
  filename: './index_prod.html',
  template: './src/template/index.ejs',
  inject: false
})

您能告诉我们您的
npm运行构建调用了哪个命令吗?
?请参阅我的编辑。兄弟