lom599乐百家官网首页systemjs + angualr2 将app文件夹里面加一层src文件夹后报错

如今的题目是移动index.html到src中就会报错找不到System变量,index.html放在根目次则正常

index.html

<html>
<head>
    <base href="/">
    <title>ng2-taidiiv2</title>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <!--<link rel="stylesheet" href="app/styles.css">-->

    <!-- Compiled and minified CSS -->
    <!--<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/materialize/0.97.6/css/materialize.min.css">-->
    <!--<link href="node_modules/materialize-css/dist/css/materialize.css" type="text/css" rel="stylesheet"-->
    <!--media="screen,projection"/>-->
    <!--<link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">-->
    <link href="//cdn.bootcss.com/material-design-icons/3.0.1/iconfont/material-icons.min.css" rel="stylesheet">

    <!-- CORE CSS-->
    <link href="../node_modules/materialize-css/dist/css/materialize.min.css" type="text/css" rel="stylesheet"
          media="screen,projection">
    <!--<link href="app/style.css" type="text/css" rel="stylesheet" media="screen,projection">-->
    <link href="assets/css/app.css" type="text/css" rel="stylesheet" media="screen,projection">

    <!--<link href="//cdn.bootcss.com/materialize/0.97.8/css/materialize.min.css" rel="stylesheet">-->
    <!--<script src="//cdn.bootcss.com/jquery/3.1.1/jquery.min.js"></script>-->
    <!--<script src="//cdn.bootcss.com/materialize/0.97.8/js/materialize.min.js"></script>-->


    <!-- Import jQuery before materialize.js -->
    <script src="../node_modules/jquery/dist/jquery.js"></script>
    <!--<script src="node_modules/hammerjs/hammer.js"></script>-->
    <script src="../node_modules/materialize-css/dist/js/materialize.min.js"></script>


    <!-- 1. Load libraries -->
    <!-- Polyfills for older browsers -->
    <script src="../node_modules/core-js/client/shim.min.js"></script>
    <script src="../node_modules/zone.js/dist/zone.js"></script>
    <script src="../node_modules/reflect-metadata/Reflect.js"></script>
    <script src="../node_modules/systemjs/dist/system.src.js"></script>


    <!-- 2. Configure SystemJS -->
    <script src="../systemjs.config.js"></script>
    <script>
        System.importapp.catchfunction err {
            console.errorerr;
        };
    </script>

</head>
<!-- 3. Display the application -->
<body>
<my-app>Loading...</my-app>
</body>
</html>

system-config.js

<html>
<head>
    <base href="/">
    <title>ng2-taidiiv2</title>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <!--<link rel="stylesheet" href="app/styles.css">-->

    <!-- Compiled and minified CSS -->
    <!--<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/materialize/0.97.6/css/materialize.min.css">-->
    <!--<link href="node_modules/materialize-css/dist/css/materialize.css" type="text/css" rel="stylesheet"-->
    <!--media="screen,projection"/>-->
    <!--<link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">-->
    <link href="//cdn.bootcss.com/material-design-icons/3.0.1/iconfont/material-icons.min.css" rel="stylesheet">

    <!-- CORE CSS-->
    <link href="../node_modules/materialize-css/dist/css/materialize.min.css" type="text/css" rel="stylesheet"
          media="screen,projection">
    <!--<link href="app/style.css" type="text/css" rel="stylesheet" media="screen,projection">-->
    <link href="assets/css/app.css" type="text/css" rel="stylesheet" media="screen,projection">

    <!--<link href="//cdn.bootcss.com/materialize/0.97.8/css/materialize.min.css" rel="stylesheet">-->
    <!--<script src="//cdn.bootcss.com/jquery/3.1.1/jquery.min.js"></script>-->
    <!--<script src="//cdn.bootcss.com/materialize/0.97.8/js/materialize.min.js"></script>-->


    <!-- Import jQuery before materialize.js -->
    <script src="../node_modules/jquery/dist/jquery.js"></script>
    <!--<script src="node_modules/hammerjs/hammer.js"></script>-->
    <script src="../node_modules/materialize-css/dist/js/materialize.min.js"></script>


    <!-- 1. Load libraries -->
    <!-- Polyfills for older browsers -->
    <script src="../node_modules/core-js/client/shim.min.js"></script>
    <script src="../node_modules/zone.js/dist/zone.js"></script>
    <script src="../node_modules/reflect-metadata/Reflect.js"></script>
    <script src="../node_modules/systemjs/dist/system.src.js"></script>


    <!-- 2. Configure SystemJS -->
    <script src="../systemjs.config.js"></script>
    <script>
        System.importapp.catchfunction err {
            console.errorerr;
        };
    </script>

</head>
<!-- 3. Display the application -->
<body>
<my-app>Loading...</my-app>
</body>
</html>

bs-config.js

{
  "port": 3000,
  "server": {
    "baseDir": "./src"
  }
}

目次:

起首,你要把报什么错贴下去啊

这个蜕化是由于你的项目中的途径和你system-config.js中配置的途径不符
根据如下代码看出你的入口文件运用的是main

System.import../system-config.js.thenfunction  {
        System.importmain;
      }.catchconsole.error.bindconsole;

那么请你变动system-config.js文件中的map东西下面的”main”属性的值 由app/main.js变动为src/app/main.js,

(看完/读完)这篇文章有何感想! lom599乐百家官网首页的分享…

发表评论

姓名 *
电子邮件 *
站点