在运行 'npm start' 命令项目编译正确但未使用 bundle.js 创建资产文件夹之后？

Question

我正在使用 lynda "Reactjs essential training" 开发一个关于 React js 的新项目。问题是当我运行 "npm start" 命令成功编译我的项目但既没有创建 "assets" 目录也没有创建 "bundle.js" 为什么？

我使用了我修改过的 "webpack.config.js" 与训练练习文件不同的地方，因为提供的文件对我不起作用。下面是代码：

.babelrc
--------
{
"presets": ["@babel/preset-env","@babel/react"]
}

package.json
------------
{
"name": "react-essential",
"version": "1.0.0",
"description": "A project focusing on React and related tools",
"main": "index.js",
"dependencies": {
"@babel/preset-react": "^7.0.0",
"babel-cli": "^6.26.0",
"babel-preset-latest": "^6.24.1",
"babel-preset-react": "^6.24.1",
"babel-preset-stage-0": "^6.24.1",
"react": "^16.7.0",
"react-dom": "^16.7.0"
},
"devDependencies": {
"@babel/core": "^7.2.2",
"@babel/preset-env": "^7.2.3",
"babel-core": "^6.26.3",
"babel-loader": "^8.0.4",
"babel-preset-react-native": "^5",
"webpack": "^4.28.3",
"webpack-cli": "^3.1.2",
 "webpack-dev-server": "^3.1.14"
},
"scripts": {
"start": "./node_modules/.bin/webpack-dev-server"
},
"author": "Muhammad Waqas",
"license": "MIT"
}

webpack.config.js
-----------------
var webpack = require("webpack");
module.exports = {
entry: __dirname + "/src/index.js",
output: {
    path: __dirname + "/dist/assets",
    filename: "bundle.js",
    publicPath: "assets"
},
devServer: {
    inline: true,
    contentBase: __dirname + "/dist",
    port: 3000
},
module: {
    rules: [{
        test: /\.js$/,
        loader: ["babel-loader"]
    }]
}
}

每当我运行 "npm start" 它应该启动 webpack-dev-server 并且更改（如果有的话）应该反映在浏览器中。

Answer 1

webpack 开发服务器不会将任何资产写入磁盘。它从记忆中为他们服务。

Answer 2

webpack 开发服务器没有写入磁盘。它从记忆中服务。如果你想创建一个生产构建，它将输出到资产文件夹，你需要添加一个构建脚本，你将运行.

将以下构建脚本添加到您的 package.json 文件中，就在启动脚本之后，顺序无关紧要：

"start": "./node_modules/.bin/webpack-dev-server", "build": "./node_modules/.bin/webpack --config webpack.config.js",

然后就可以在命令行运行下面，创建一个build

npm run build

就像运行宁

npm run start

在运行 'npm start' 命令项目编译正确但未使用 bundle.js 创建资产文件夹之后？

After running 'npm start' command project is compiling correctly but not creating assets folder with bundle.js?

javascript

reactjs

webpack

webpack-dev-server

在 运行 'npm start' 命令项目编译正确但未使用 bundle.js 创建资产文件夹之后？

After running 'npm start' command project is compiling correctly but not creating assets folder with bundle.js?

javascript

reactjs

webpack

webpack-dev-server

在运行 'npm start' 命令项目编译正确但未使用 bundle.js 创建资产文件夹之后？