Angular 如何组织网站'；s带有角度4的公共部分（或其他fm）？

我有下一个情况。网站分为管理和前端

管理员完全开发了Angular 4，我对此非常满意。Angular cli等，非常适合SPA，只有一个入口点

但与前端混淆了。它是用Laravel编写的，并将通过它进行渲染。无法了解如何使用Angular 4，如何设置工作流

我应该在前面解决的问题-小的、独立的、但动态的块，如货币列表或建议表单

需要一些简单的渲染框架/库，没有太多依赖项和简单的工作流

检查反应-但对我来说太复杂了

---

UPD:现在考虑一下Vue.js。它不需要预编译，可以应用于DOM元素及其在系统中可移动的组件。

公共部分可以使用React或Vue完成，直到它们都是模块化的，并且没有太多样板文件。我选择了反应

我的系统配置包括React和带有Typescript的网页包

module.exports = {
    entry: {
        map: "./src/components/map/app.tsx",
        common: "./src/common.apps.tsx",
        share: "./src/components/objectshare.tsx",
        object: "./src/components/object/index.tsx",
        vendor: ['react', 'react-dom', 'socket.io-client', 'whatwg-fetch', 'mobx']
    },
    output: {
        filename: "[name].js",
        path: __dirname + "./../../html/js/public"
    },

    devtool: "source-map",

    resolve: {
        extensions: [".ts", ".tsx", ".js", ".json", ".css"]
    },

    module: {
        rules: [
             { test: /\.tsx?$/, loader: "awesome-typescript-loader" },
             { enforce: "pre", test: /\.js$/, loader: "source-map-loader" }
    ]
};

所有的魔术都是通过

entry

Webpack选项完成的。

entry

中的每个条目在公共js位置创建适当的文件。库绑定到供应商并插入到每个页面中

Src

文件夹包含用于具体页面（地图、对象等）的不同文件夹和用于UTIL等模块的

common

文件夹

在后端，我在页面模板中插入所需的脚本，基本上带有

script

标记

---

将编译后的文件直接发布到名为

html

公共部分的生产文件夹可以使用React或Vue完成，直到它们都是模块化的，并且没有太多样板文件。我选择了反应

我的系统配置包括React和带有Typescript的网页包

module.exports = {
    entry: {
        map: "./src/components/map/app.tsx",
        common: "./src/common.apps.tsx",
        share: "./src/components/objectshare.tsx",
        object: "./src/components/object/index.tsx",
        vendor: ['react', 'react-dom', 'socket.io-client', 'whatwg-fetch', 'mobx']
    },
    output: {
        filename: "[name].js",
        path: __dirname + "./../../html/js/public"
    },

    devtool: "source-map",

    resolve: {
        extensions: [".ts", ".tsx", ".js", ".json", ".css"]
    },

    module: {
        rules: [
             { test: /\.tsx?$/, loader: "awesome-typescript-loader" },
             { enforce: "pre", test: /\.js$/, loader: "source-map-loader" }
    ]
};

所有的魔术都是通过

entry

Webpack选项完成的。

entry

中的每个条目在公共js位置创建适当的文件。库绑定到供应商并插入到每个页面中

Src

文件夹包含用于具体页面（地图、对象等）的不同文件夹和用于UTIL等模块的

common

文件夹

在后端，我在页面模板中插入所需的脚本，基本上带有

script

标记

将编译后的文件直接发布到名为

html

的生产文件夹