how to deploy ember-cli project in apache server

2020-07-26 11:17发布

问题:

I have the following problem.

I created an ember application with ember-cli.

The application works fine on nodejs through the url http://localhost:4200/ when running the command ember serve

I want to deploy this application on an apache httpd server.

In order that this will work i think that it should work also standalone when opening in firefox.

When i open it in firefox i get an error:

require is not defined

The generated index.html is

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <title>Foo</title>
    <meta name="description" content="">
    <meta name="viewport" content="width=device-width, initial-scale=1 user-scalable=no">

    <base href="/" />

    <link rel="stylesheet" href="assets/vendor.css">
    <link rel="stylesheet" href="assets/foo.css">
  </head>
  <body>
    <script>
      window.FooENV = {"environment":"development","baseURL":"/","locationType":"auto","EmberENV":{"FEATURES":{}},"APP":{"LOG_RESOLVER":true,"LOG_ACTIVE_GENERATION":true,"LOG_MODULE_RESOLVER":true,"LOG_VIEW_LOOKUPS":true},"LOG_MODULE_RESOLVER":true};
      window.EmberENV = window.FooENV.EmberENV;
    </script>
    <script src="assets/vendor.js"></script>
    <script src="assets/foo.js"></script>
    <script>
      window.Foo = require('foo/app')['default'].create(FooENV.APP);
    </script>
  </body>
</html>

How can i solve this issue?

Thanks,

David

回答1:

file:///J:/assets/ndd.css

This looks to me like you just double clicked your index.html file in your dist folder. This does not work!

You have to serve your directory by an http-server.

Install a simple http server with npm:

npm install -g http-server

Move to your dist folder and run http-server. You will see a message like this:

Starting up http-server, serving ./ on port: 8080

Now you can check your ember app in Firefox on: http://localhost:8080



回答2:

Here's what you have to do in order to correctly deploy an Ember CLI app in apache.

Let's assume you are going to use XAMPP. You are probably going to create a folder inside htdocs and name it myapp. When running the ember new appname command from within myapp, the CLI when generate the whole project and put it inside appname folder.

Now, when you will build the project when ember build, the whole compiled version of the app will be located in: myapp\appname\dist.

Because Ember CLI uses the base meta tag in index.html, you will need to modify the baseUrl variable in myapp\appname\config\environment.js, and set it to myapp/appname/dist/. Rebuild and the app will work by visiting localhost/myapp/appname/dist

This is a slightly complicated and totally unpractical folder structure, but it is a good example of how it works and I'm sure newcomers will stumble upon the exact same use case.