首页
学习
活动
专区
圈层
工具
发布
首页
学习
活动
专区
圈层
工具
MCP广场
社区首页 >问答首页 >在npm运行生成后无法解析index.html中的路径

在npm运行生成后无法解析index.html中的路径
EN

Stack Overflow用户
提问于 2018-04-17 20:33:24
回答 1查看 530关注 0票数 0

我运行以下命令来构建我的项目:

npm运行构建

但是我找不到index.html文件和其他.js文件。

我的webpack.config.js

代码语言:javascript
复制
var path = require('path')
var webpack = require('webpack')
var AssetsPlugin = require('assets-webpack-plugin')
//var ExtractTextPlugin = require("extract-text-webpack-plugin");

var DEBUG = !(process.env.NODE_ENV === 'production')

if (DEBUG) {
  require('dotenv').config()
}

var config = {
  devtool: DEBUG ? 'cheap-module-eval-source-map' : false,
  entry: {
    app: ['./app/app'],
    vendor: [
      'react',
      'react-router',
      'redux',
      'react-dom',
      'lodash',
      'bluebird',
      'humps',
      'history'
    ]
  },
  resolve: {
    modules: [ path.join(__dirname, 'app'), 'node_modules' ]
  },
  output: {
    path: path.join(__dirname, 'dist'),
    filename: '[name].js'
  },
  plugins: [
    //new ExtractTextPlugin('styles.css'),
    new webpack.EnvironmentPlugin(['NODE_ENV', 'API_BASE_URL']),
    new webpack.ProvidePlugin({
      $: 'jquery',
      jQuery: 'jquery',
      'window.jQuery': 'jquery'
    })
  ],
  module: {
    rules: [
      {
        test: /\.js$/,
        loader: 'babel-loader',
        exclude: /node_modules/,
        include: __dirname
      },
      {
      //  test: /\.css$/,
        test:/\.(s*)css$/,
        use: [
          { loader: "style-loader" },
          { loader: "css-loader" }
        ]
      }
    ]
  }
}


if (DEBUG) {
  config.entry.app.push('webpack-hot-middleware/client?path=/__webpack_hmr')

  config.plugins = config.plugins.concat([
    new webpack.HotModuleReplacementPlugin(),
    new webpack.optimize.CommonsChunkPlugin({
      name: 'vendor',
      filname: 'vendor.js'
    })
  ])
  config.output.publicPath = '/'
  config.module.rules.unshift({
    test: /\.js$/,
    loader: 'react-hot-loader',
    exclude: /node_modules/,
    include: __dirname
  })
} else {
  config.plugins = config.plugins.concat([
    new webpack.optimize.CommonsChunkPlugin({
      name: 'vendor',
      filname: '[name].[chunkhash].js'
    }),
    new webpack.optimize.UglifyJsPlugin(),
  ])
}

module.exports = config

dist目录中:

package.json:

代码语言:javascript
复制
{
  "name": "universal-redux-template",
  "version": "0.0.0",
  "description": "Universal Redux Template",
  "scripts": {
    "lint": "eslint app bin",
    "start": "cross-env NODE_PATH=./app concurrently --kill-others \"node app/server\" \"gulp css:watch\"",
    "test:prebuild": "./bin/test-prebuild",
    "test:watch": "yarn run test:prebuild; yarn run test:babelwatch",
    "test:babelwatch": "NODE_ENV=test babel app --out-dir .babel-test-build --source-maps --watch --ignore app/assets app/styles app/server  --skip-initial-build",
    "test": "./bin/test",
    "test:ci": "yarn run test:prebuild; yarn test",
    "webpack": "webpack",
    "build": "rimraf dist/ && npm run webpack && gulp build",
    "postinstall": "npm run build"
  },
  "engines": {
    "node": "6.1.0",
    "npm": "3.8.6"
  },
  "repository": {
    "type": "git",
    "url": "https://github.com/mz026/universal-redux-template"
  },
  "license": "MIT",
  "bugs": {
    "url": "https://github.com/mz026/universal-redux-template/issues"
  },
  "dependencies": {
    "assets-webpack-plugin": "^3.2.0",
    "babel-core": "^6.3.15",
    "babel-loader": "^6.2.0",
    "babel-polyfill": "^6.3.14",
    "babel-preset-es2015": "^6.3.13",
    "babel-preset-react": "^6.3.13",
    "babel-register": "^6.5.1",
    "bluebird": "^2.10.0",
    "compression": "^1.6.0",
    "concurrently": "^2.0.0",
    "cross-env": "^1.0.7",
    "crypto-js": "^3.1.9-1",
    "easytimer.js": "^2.2.1",
    "ejs": "^2.3.4",
    "express": "^4.13.3",
    "gulp": "^3.9.0",
    "gulp-autoprefixer": "^3.1.0",
    "gulp-load-plugins": "^1.2.0",
    "gulp-rev": "^6.0.1",
    "gulp-rev-all": "^0.8.24",
    "gulp-rev-replace": "^0.4.3",
    "gulp-sass": "^2.1.1",
    "gulp-sourcemaps": "^1.6.0",
    "history": "^1.17.0",
    "humps": "^0.6.0",
    "immutable": "^3.8.1",
    "jalaali-js": "^1.1.0",
    "lodash": "^3.10.1",
    "node-sass": "^3.4.2",
    "normalizr": "^1.0.0",
    "owl.carousel": "^2.3.2",
    "prop-types": "^15.5.10",
    "react": "^15.4.2",
    "react-dom": "^15.4.2",
    "react-helmet": "^5.1.3",
    "react-redux": "^5.0.5",
    "react-router": "^3.0.5",
    "react-slick": "^0.22.3",
    "redux": "^3.0.0",
    "redux-logger": "^1.0.9",
    "redux-thunk": "^0.1.0",
    "rewire": "^2.3.4",
    "rimraf": "^2.5.2",
    "run-sequence": "^1.2.2",
    "slick-carousel": "^1.8.1",
    "superagent": "^1.8.5",
    "webpack": "^2.2.0"
  },
  "devDependencies": {
    "babel-eslint": "^7.2.1",
    "babel-plugin-react-transform": "^2.0.0",
    "babel-plugin-rewire": "^1.0.0-beta-5",
    "chai": "^3.3.0",
    "chai-as-promised": "^5.1.0",
    "chokidar": "^1.6.1",
    "css-loader": "^0.28.11",
    "dotenv": "^4.0.0",
    "enzyme": "^2.3.0",
    "eslint": "^3.18.0",
    "eslint-plugin-babel": "^3.2.0",
    "eslint-plugin-react": "^6.0.0",
    "extract-text-webpack-plugin": "^3.0.2",
    "jsdom": "^7.0.1",
    "md5-file": "^3.1.1",
    "mocha": "^2.4.5",
    "nock": "^2.17.0",
    "react-addons-test-utils": "^15.4.2",
    "react-hot-loader": "^1.3.1",
    "rewire-webpack": "^1.0.0",
    "sinon": "^1.17.1",
    "sinon-chai": "^2.8.0",
    "style-loader": "^0.20.3",
    "webpack-dev-middleware": "^1.10.2",
    "webpack-hot-middleware": "^2.18.0"
  }
}
EN

回答 1

Stack Overflow用户

发布于 2018-04-17 20:44:11

如果你使用的是《Webpack 3》,我想你可能错过了HTML插件

代码语言:javascript
复制
const HtmlWebpackPlugin = require('html-webpack-plugin')

module.exports = {
  entry: 'index.js',
  output: {
    path: __dirname + '/dist',
    filename: 'index_bundle.js'
  },
  plugins: [
    new HtmlWebpackPlugin()
  ]
}

这将生成一个dist/index.html文件。

票数 0
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/49878262

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档