Как настроить файлы среды для dev, local и prod apl, флаг в NativeScript Vue?

Question

Повестка дня заключается в использовании определенных флагов и определенного базового URL-адреса API для различных режимов, например dev, local и prod, в моем приложении NativeScript Vue. Также как NativeScript angular имеет среду. [Mode] .ts файлы?

Я пытался использовать файлы .env. [Mode], ссылаясь на документы VueJs. // https://cli.vuejs.org/guide/mode-and-env.html#environment-variables.com Но это не благоприятствовало сценарию.

// Примерно так из конфига, module.exports = { NODE_ENV: "производство", ROOT_API: "какой-то api url" }

Конфиг должен быть доступен вот так process.env.ROOT_API во всем приложении.

Answer 1

См. Раздел Pass Environment Variables в документации.

Вы также можете указать переменные окружения для сборки Webpack:

$ tns build android --bundle --env.development --env.property = value К ним можно получить доступ через объект env в конфигурации Webpack:

// webpack.config.js
module.exports = env => {
    console.dir(env); // { development: true, property: 'value' }
}

Вы можете обновить DefinePlugin примерно так, как показано ниже,

new webpack.DefinePlugin({
            "global.TNS_WEBPACK": "true",
            "global.ENV_NAME": JSON.stringify(name),
            "global.ENV_PROPERTY": JSON.stringify(env.property),
            process: undefined,
        }),

Теперь использование global.ENV_PROPERTY в любом месте вашего проекта должно быть заменено фактическим значением, которое вы передаете в командной строке во время компиляции.

Если вы знакомы с веб-пакетом, вы также можете настроитьCopyWebpackPlugin для копирования правильного файла среды в ваше приложение вместо переменной для каждой конфигурации.