Docker метание поста css ошибка при построении образа сапера - PullRequest
0 голосов
/ 01 мая 2020

Я пытаюсь использовать сапер с попутным ветром в контейнере docker. Когда я пытаюсь построить образ, docker выдает эту ошибку:

enter image description here

Сборка не дает сбоя, но css нет загрузить правильно при запуске приложения в контейнере. В сборке dev нет ничего плохого, и все css загружаются нормально.

Dockerfile:

# This stage builds the sapper application.
FROM mhart/alpine-node:12 AS build-app
WORKDIR /app
COPY . .
RUN npm install --no-audit --unsafe-perm
RUN npm run build 


# This stage installs the runtime dependencies.
FROM mhart/alpine-node:12 AS build-runtime
WORKDIR /app
COPY package.json package-lock.json  ./
RUN npm ci --production --unsafe-perm

# This stage only needs the compiled Sapper application
# and the runtime dependencies.
FROM mhart/alpine-node:slim-12
WORKDIR /app
COPY --from=build-app /app/__sapper__ ./__sapper__
COPY --from=build-app /app/static ./static
COPY --from=build-runtime /app/node_modules ./node_modules


ENV PORT 8080
ENV HOST 0.0.0.0

EXPOSE 8080
CMD ["node", "__sapper__/build"]

Пакет. json:

"watch:tailwind": "postcss static/tailwind.css -o static/index.css -w",
        "build:tailwind": "NODE_ENV=production postcss static/tailwind.css -o static/index.css",
        "build": "npm run build:tailwind && sapper build --legacy",
        "dev": "sapper dev",
        "export": "sapper export --legacy",
        "start": "node __sapper__/build",
        "cy:run": "cypress run",
        "cy:open": "cypress open",
        "test": "run-p --race dev cy:run",
        "deploy-prod": "firebase deploy --debug --token \"$FIREBASE_TOKEN\" --only hosting",
        "deploy-dev": "firebase deploy --debug  --only hosting --project jointcreative1-dev"
    },
    "dependencies": {
        "@fullhuman/postcss-purgecss": "^2.1.2",
        "@rollup/plugin-json": "^4.0.3",
        "compression": "^1.7.4",
        "connect-redis": "^4.0.4",
        "cssnano": "^4.1.10",
        "express": "^4.17.1",
        "express-session": "^1.17.1",
        "firebase": "^7.14.2",
        "postcss-load-config": "^2.1.0",
        "redis": "^3.0.2",
        "session-file-store": "^1.4.0",
        "sirv": "^0.4.2"
    },
    "devDependencies": {
        "@babel/core": "^7.9.0",
        "@babel/plugin-syntax-dynamic-import": "^7.8.3",
        "@babel/plugin-transform-runtime": "^7.9.0",
        "@babel/preset-env": "^7.9.0",
        "@babel/runtime": "^7.9.2",
        "@rollup/plugin-commonjs": "^11.0.2",
        "@rollup/plugin-node-resolve": "^7.1.3",
        "@rollup/plugin-replace": "^2.3.1",
        "@rollup/pluginutils": "^3.0.9",
        "firebase-tools": "^7.16.2",
        "npm-run-all": "^4.1.5",
        "postcss": "^7.0.27",
        "postcss-cli": "^7.1.0",
        "rollup": "^1.32.1",
        "rollup-plugin-babel": "^4.4.0",
        "rollup-plugin-node-resolve": "^5.2.0",
        "rollup-plugin-svelte": "^5.2.1",
        "rollup-plugin-terser": "^5.3.0",
        "sapper": "^0.27.12",
        "svelte": "^3.21.0",
        "svelte-preprocess": "^3.7.4",
        "tailwindcss": "^1.3.5"
    }

Post css .config

const tailwindcss = require("tailwindcss");

const cssnano = require("cssnano")({
  preset: "default"
});

const purgecss = require("@fullhuman/postcss-purgecss")({
  content: ["./src/**/*.svelte", "./src/**/*.html"],
  defaultExtractor: content => content.match(/[A-Za-z0-9-_:/]+/g) || []
});

module.exports = {
  plugins: [
    tailwindcss("./tailwind.config.js"),
    ...(process.env.NODE_ENV === "production"
      ? [purgecss, cssnano]
      : [])
  ]
};

rollup.config


export default {
    client: {
        input: config.client.input(),
        output: config.client.output(),
        plugins: [
            replace({
                'process.browser': true,
                'process.env.NODE_ENV': JSON.stringify(mode),
            }),
            svelte({
                dev,
                hydratable: true,
                emitCss: true,
                preprocess: sveltePreprocess({ postcss: true }),
            }),
            resolve({
                browser: true,
                dedupe: ['svelte'],
            }),
            commonjs(),
            legacy &&
                babel({
                    extensions: ['.js', '.mjs', '.html', '.svelte'],
                    runtimeHelpers: true,
                    exclude: ['node_modules/@babel/**'],
                    presets: [
                        [
                            '@babel/preset-env',
                            {
                                targets: '> 0.25%, not dead',
                            },
                        ],
                    ],
                    plugins: [
                        '@babel/plugin-syntax-dynamic-import',
                        [
                            '@babel/plugin-transform-runtime',
                            {
                                useESModules: true,
                            },
                        ],
                    ],
                }),

            !dev &&
                terser({
                    module: true,
                }),
        ],

        onwarn,
    },

    server: {
        input: config.server.input(),
        output: config.server.output(),
        plugins: [
            replace({
                'process.browser': false,
                'process.env.NODE_ENV': JSON.stringify(mode),
            }),
            svelte({
                generate: 'ssr',
                dev,
                preprocess: sveltePreprocess({ postcss: true })
            }),
            resolve({
                dedupe: ['svelte'],
            }),
            commonjs(),
        ],
        external: Object.keys(pkg.dependencies).concat(
            require('module').builtinModules ||
                Object.keys(process.binding('natives'))
        ),

        onwarn,
    },

    serviceworker: {
        input: config.serviceworker.input(),
        output: config.serviceworker.output(),
        plugins: [
            resolve(),
            replace({
                'process.browser': true,
                'process.env.NODE_ENV': JSON.stringify(mode),
            }),
            commonjs(),
            !dev && terser(),
        ],

        onwarn,
    },
};

...