在根文件夹而不是 ./dist 中构建包裹

Question

我很困惑为什么我的包裹构建脚本将所有内容都喷入根文件夹而不是./dist ，我尝试指定有和没有 output 路径但没有运气。

更让我困惑的是我的start脚本"parcel index.html"如何输出到dist文件夹中。

为了澄清以下内容，我正在运行： npm run build

这是我的 package.json

感谢您的任何帮助！

{ 
  "name": "eclaires","version": "1.0.0",
  "description": "",
  "main": "index.html",
  "browserslist": "last 10 versions",
  "scripts": {
    "watch:sass": "node-sass sass/main.scss css/style.css -w",
    "start": "parcel index.html",
    "devserver": "live-server",
    "compile:sass": "node-sass sass/main.scss css/style.comp.css",
    "prefix:css": "postcss css/style.comp.css --use autoprefixer -o css/style.prefix.css",
    "compress:css": "node-sass css/style.prefix.css css/style.css --output-style compressed",
    "build:css": "npm-run-all compile:sass prefix:css compress:css",
    "build:html": "parcel build index.html --dist-dir ./dist",
    
    "build": "npm-run-all build:css build:html"
  },
  "author": "LY",
  "license": "ISC",
  "dependencies": {},
  "devDependencies": {
    "autoprefixer": "^10.2.4",
    "core-js": "^3.8.3",
    "node-sass": "^5.0.0",
    "npm-run-all": "^4.1.5",
    "parcel": "^2.0.0-beta.1",
    "postcss": "^8.2.6",
    "postcss-cli": "^8.3.1"
  }
}

Answer 1

通常，在构建期间使用--dist-dir <dir>选项：

parcel build index.js --dist-dir ./dist

或在package.json#main为您的项目指定构建目录。

{
  "main": "dist/index.js"
  "scripts": {
    "build": "parcel build"
  }
}

您的main设置为根index.html ，这就是为什么它是 output 的原因。

此外，运行npm start输出到dist但npm build输出到 root 的原因是因为您的启动脚本设置为：

"start": "parcel index.html",

这相当于 Parcel 的默认serve命令：

parcel serve index.html

Parcel 的serve命令的行为可能与build不同。

Answer 2

看起来您没有设置 output 目录。

根据文档，您可以像我在下面那样做，这将创建 dist 文件夹和文件：

https://parceljs.org/cli.html

 { "name": "silicia", "version": "1.0.0", "description": "", "main": "index.html", "dependencies": { "parcel": "^1.12.3" }, "devDependencies": { "sass": "^1.32.8" }, "scripts": { "dev": "parcel index.html", "build": "parcel build index.html --out-dir./dist" }, "author": "Jesus Ramirez", "license": "ISC" }