国产av日韩一区二区三区精品,成人性爱视频在线观看,国产,欧美,日韩,一区,www.成色av久久成人,2222eeee成人天堂

這可能看起來有點復(fù)雜，答案可能是“不要那樣做，這樣做”，所以我將從我正在做的事情的背景開始?；旧衔矣幸粋€遺留的 AngularJS 應(yīng)用程序，我們希望將其從 Vue 遷移到 Vue。我們無法選擇端到端重寫應(yīng)用程序，并且需要一點一點地進(jìn)行，同時仍然提供功能齊全的應(yīng)用程序。

因此，總體目標(biāo)是讓兩個框架同時運行，我希望我可以對路由做一些事情，或者可能將我的單頁面應(yīng)用程序分成兩個單獨的頁面以用于不同的框架。我已經(jīng)將 angularjs 從使用 gulp 構(gòu)建管道轉(zhuǎn)換為使用 webpack，因為我認(rèn)為這是讓 Vue 運行的邏輯第一步，但現(xiàn)在我遇到了障礙。

我用于構(gòu)建角度應(yīng)用程序的 webpack.config.js 如下所示：

const path = require('path');
const HtmlWebpackPlugin = require('html-webpack-plugin');

module.exports = {
    target: 'web',
    // mode: "development",
    // devtool: "source-map",
    module: {
        rules: [

            {
                test: /\.html$/,
                loader: "html-loader",
            },
            {
                test: /\.s[ac]ss$/i,
                use: [
                  "style-loader",
                  "css-loader",
                  "sass-loader",
                ],
              },
              {
                test: require.resolve("jquery"),
                loader: "expose-loader",
                options: {
                  exposes: ["$", "jQuery"],
                },
              }
        ],
    },
    entry: {
        vendor: "./source/vendor.js",
        main: "./source/index.js",
    },
    optimization: {
        minimize: false
    },
    output: {
        filename: '[name].bundle.js',
        path: path.resolve(__dirname, 'distribution'),
        clean:true
    },
    plugins: [
        new HtmlWebpackPlugin({
            template: 'source/index.html',
        })
    ]
};

現(xiàn)在工作正常，我得到了一些東西，添加了像以前一樣工作的結(jié)尾。

然后我添加了一個 /source/vueJs 目錄，并復(fù)制并粘貼了 vue create hello-world 生成的內(nèi)容 hello world 項目。我的假設(shè)是，如果我可以修改我的 webpack.config.js 來構(gòu)建它，然后我可以進(jìn)一步迭代它以達(dá)到將兩個工作應(yīng)用程序合并在一起的程度，但我已經(jīng)在努力獲得 hello-world vue 項目可以生產(chǎn)任何東西。

到目前為止，我基本上注釋掉了所有相關(guān)的 angularJS 部分，并添加了我認(rèn)為正確的內(nèi)容來構(gòu)建 vue 應(yīng)用程序，所以現(xiàn)在我有了：

const path = require('path');
const HtmlWebpackPlugin = require('html-webpack-plugin');
const { VueLoaderPlugin } = require('vue-loader')

module.exports = {
    target: 'web',
    mode: "development",
    devtool: "source-map",
    module: {
        rules: [

            // {
            //     test: /\.html$/,
            //     loader: "html-loader",
            // },
            // {
            //     test: /\.s[ac]ss$/i,
            //     use: [
            //       "style-loader",
            //       "css-loader",
            //       "sass-loader",
            //     ],
            //   },
            //   {
            //     test: require.resolve("jquery"),
            //     loader: "expose-loader",
            //     options: {
            //       exposes: ["$", "jQuery"],
            //     },
            //   },
            {
                test: /\.(png|jpe?g|gif)$/i,
                use: [
                  {
                    loader: 'file-loader',
                  },
                ],
              },
              {
                test: /\.vue$/,
                loader: 'vue-loader'
              },
              // this will apply to both plain `.js` files
              // AND `<script>` blocks in `.vue` files
              {
                test: /\.js$/,
                loader: 'babel-loader'
              },
              // this will apply to both plain `.css` files
              // AND `<style>` blocks in `.vue` files
              {
                test: /\.css$/,
                use: [
                  'vue-style-loader',
                  'css-loader'
                ]
              }
        ],
    },
    entry: {
        // vendor: "./source/vendor.js",
        // angular: "./source/index.js",
        vue: "./source/vueJs/index.js"
    },
    optimization: {
        minimize: false
    },
    output: {
        filename: '[name].bundle.js',
        path: path.resolve(__dirname, 'distribution'),
        clean:true
    },
    plugins: [
        new HtmlWebpackPlugin({
            //template: 'source/index.html',
        }),
        new VueLoaderPlugin()
    ],
};

這運行正常，我得到一個 distribution/ 目錄，其中包含我的資產(chǎn)，但是所提供的站點運行起來就像根本沒有運行 JavaScript 一樣。比較我的版本上 npx webpack 的輸出和 hello-world 項目上 npx vue-cli-service build 的輸出，javascript 類似，但在很多關(guān)鍵領(lǐng)域有所不同，一開始似乎我的版本確實如此沒有像 hello world 項目那樣嵌入任何 HTML。

嘗試從 webpack 編譯 vue 應(yīng)用程序會失敗嗎？你只能使用 vue-cli-service build 來做到這一點，因此僅限于 vue 嗎？我嘗試使用 https://cli.vuejs.org/guide/webpack.html 和 https://cli.vuejs.org/config/ 中找到的信息修改我的 vue.config.js，但坦率地說，我覺得我出局了我目前的深度，不確定我正在做的事情是否是一個好主意。

是否有更好的策略可以實現(xiàn)我的最終目標(biāo)？如果這是一個可行的解決方案，我需要更改哪些配置才能正確構(gòu)建 angularjs 和 vue 應(yīng)用程序？