3

過去にクライアント側のアプリケーションを開発するとき、私は常にある種のサーバー側のアプリケーションを使用してJavaScriptをパッケージ化して提供していました。これにより、本番環境と開発環境の間で変化する環境変数をクライアントに渡すことができました。

私はRequireJSを使用して純粋なクライアント側アプリケーションに取り組んでおり、静的Webサーバーでそれを提供しています。一部の構成は、アプリが開発中または本番環境のどちらでローカルに実行されているかによって異なります（つまり、アプリがAJAX要求を行うサーバーのURL）。

RequireJSを使用して現在の環境を判別するための最良の方法は何ですか？

4

2 に答える 2

3

私が発見したもう1つのアプローチは、RequireJS構成を直接使用することです。RequireJS 1.1以降、任意の構成値を含めることができます。私のメイン構成ではenv: 'development'を設定し、ビルド中に（r.jsを使用して）値をに設定しました'production'。

とのconfig2つのファイルを含むディレクトリを作成しました。適切なファイルのロードは、Requireプラグイン（これを呼び出します）を使用して実行できます。development.jsproduction.jsenv

define(function() {

    return {
        load: function(name, req, load, config) {
            if (!config.env || config.isBuild) {
                config.env = 'production';
            }

            var path = name + '/' + config.env;
            req([path], function(mod) {
                load(mod);
            });
        }
    };

});

これが私がそれを使う方法です：

var config = require('env!config');
于 2013-01-30T18:01:55.083 に答える
1 
// you can store two configs in two separate files
// FILE NAME: config-development.json:
// FILE CONTENT: {"url":"http://localhost:8000"}
// FILE NAME: config-production.json:
// FILE CONTENT: {"url":"http://google.com"}

// then load correct one and save it to variable
var config = getConfig();

function getConfig() {
  // if you pass ?dev=true to your url address default config that will be used is `config-development`
  // otherwise - `config-production`
  var configName = getParameterByName('dev', false) ? 'config-development' : 'config-production';

  window._config || (window._config = {});

  // for production version you should concat your config with main script or put it above main script
  // inside global `_config` variable for example
  if (window._config[configName]) return window._config[configName];

  // for development version you can just make an ajax call to get the config
  $.ajax({
    url : 'app/' + configName + '.json',
    async : false,
    success : function(response) {
      window._config[configName] = response;
    }
  });
  return window._config[configName];
}

// helper
function getParameterByName(name, defaults, location) {
  location = location || window.location.href;
  name = name.replace(/[\[]/,'\\\[').replace(/[\]]/,'\\\]');
  var result = new RegExp('[\\?&]' + name + '=([^&#]*)').exec(location);
  return result === null ? defaults : decodeURIComponent(result[1].replace(/\+/g, ' '));
}

// usage
console.log(config.url); // `http://localhost:8000` for development env
                         // `http://google.` for production env
于 2013-01-21T17:44:04.293 に答える