phoenix使用vue--单独js（不使用app.js）

实际中不能都在一个js里

api.js

app.js

admin.js －－vue 后台

记录下方法

static--admin－－hello.js

import "phoenix_html"

import Vue from "vue";

new Vue({
  el: "#hello-world",
  data: {
    message: "Hello World"
  }
});

brunch-config.coffee

exports.config =
  files:
    javascripts: 
      joinTo:
        'js/vendor.js': /(^node_modules/phoenix|^node_modules/phoenix_html|^node_modules/vue)/
        'js/app.js': /(^web/static/app)/
        'js/admin.js': /(^web/static/admin)/
    stylesheets: 
      joinTo: 'css/app.css'
    templates: 
      joinTo: 'js/app.js'
  conventions: 
    assets: /^(web/static/assets)/
  paths:
    watched: [
      'web/static'
      'test/static'
    ]
    public: 'priv/static'
  plugins: 
    babel: 
      ignore: [ /web/static/vendor/ ]
  modules: 
    autoRequire:
      'js/app.js': [ 'web/static/app/app' ]
      
  npm:
    enabled: true
    whitelist: [
      'phoenix'
      'phoenix_html'
      'vue'
    ]

app.html.eex

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <meta name="description" content="">
    <meta name="author" content="">

    <title>Hello Ass2!</title>
    <link rel="stylesheet" href="<%= static_path(@conn, "/css/app.css") %>">
  </head>

  <body>
    <div class="container">
      <header class="header">
        <nav role="navigation">
          <ul class="nav nav-pills pull-right">
            <li><a href="http://www.phoenixframework.org/docs">Get Started</a></li>
          </ul>
        </nav>
        <span class="logo"></span>
      </header>

      <p class="alert alert-info" role="alert"><%= get_flash(@conn, :info) %></p>
      <p class="alert alert-danger" role="alert"><%= get_flash(@conn, :error) %></p>

      <main role="main">
        <%= render @view_module, @view_template, assigns %>
      </main>

    </div> <!-- /container -->
    <script src="<%= static_path(@conn, "/js/vendor.js") %>"></script> 
    <script src="<%= static_path(@conn, "/js/admin.js") %>"></script> 
    <script>
      require('web/static/admin/hello');
    </script>
  </body>
</html>

index.html.eex

<div id="hello-world">
  {{message}}
</div>