关键词：
【中文标题】无法访问我的站点中的链接（复制和粘贴）：Node.js - Express.js - Webpack - Vue.js - 历史模式【英文标题】：Unable to acess links (copying and pasting) whitin my Site : Node.js - Express.js - Webpack - Vue.js - historymode 【发布时间】：2021-01-13 04:29:48 【问题描述】：我最近创建了一个基于 Node.js、Express.js 和 Vue.js 的网站，其中路由器处于历史模式和 Webpack。 由于是单页应用程序，我安装了 express-history-api-fallback 并且到目前为止它工作得很好但是（总是有一个但是）由于某些我不理解某些 url 的原因，我得到了一个白页还有一些错误，例如：
Uncaught SyntaxError: Unexpected token '<' ------ manifest.61d5cd8248647cdb144a.js:1
Uncaught SyntaxError: Unexpected token '<' ------ vendor.db7271094dc9fcde8b9f.js:1
Uncaught SyntaxError: Unexpected token '<' ------ app.3cfe27cef1608de00b06.js:1
我不明白问题是在我的 webpack conf 文件中还是在我的 node.js 中（我猜与前端有关，因为我在 be 中没有看到任何传入的请求）或在我的 vue 中-路由器。
我不明白（除了缺乏知识）的原因是，如果我尝试访问我的 Vue 应用程序中的一个页面，点击一个链接（即访问格式为 mywebsiteinexample.com 的用户个人资料页面） /user/userId) 它可以工作，但如果我刷新页面，我只能看到一个白色页面，并且在控制台内，我在上面写的错误。
我的文件的一般架构：
我猜这里有一些有用的代码：
Server.js
const express = require('express')
const fallback = require('express-history-api-fallback')
const path = require('path')
const historyModeHandlerHTTP = express()
const root = `$__dirname/../`
historyModeHandlerHTTP.use(express.static(root))
historyModeHandlerHTTP.use(fallback(path.join(__dirname + '/../index.html')))
historyModeHandlerHTTP.listen(80, () =>
console.log('HTTP Server on')
)
Webpack.prod.conf.js
'use strict'
const path = require('path')
const utils = require('./utils')
const webpack = require('webpack')
const config = require('../config')
const merge = require('webpack-merge')
const baseWebpackConfig = require('./webpack.base.conf')
const CopyWebpackPlugin = require('copy-webpack-plugin')
const
CleanWebpackPlugin
= require('clean-webpack-plugin');
const HtmlWebpackPlugin = require('html-webpack-plugin')
const ExtractTextPlugin = require('extract-text-webpack-plugin')
const OptimizeCSSPlugin = require('optimize-css-assets-webpack-plugin')
const UglifyJsPlugin = require('uglifyjs-webpack-plugin')
const env = require('../config/prod.env')
const webpackConfig = merge(baseWebpackConfig,
module:
rules: utils.styleLoaders(
sourceMap: config.build.productionSourceMap,
extract: true,
usePostCSS: true
)
,
devtool: config.build.productionSourceMap ? config.build.devtool : false,
output:
path: config.build.assetsRootMain,
filename: utils.assetsPath('js/[name].[chunkhash].js'),
chunkFilename: utils.assetsPath('js/[id].[chunkhash].js')
,
plugins: [
new webpack.DefinePlugin(
'process.env': env
),
new webpack.ProgressPlugin(),
new CleanWebpackPlugin(
dry: false,
cleanOnceBeforeBuildPatterns: [config.build.assetsSubDirectory + '*/js/*', config.build.assetsSubDirectory + '*/css/*']
),
new UglifyJsPlugin(
uglifyOptions:
compress:
warnings: false
,
sourceMap: config.build.productionSourceMap,
parallel: true
),
new ExtractTextPlugin(
filename: utils.assetsPath('css/[name].[contenthash].css'),
allChunks: true,
),
new OptimizeCSSPlugin(
cssProcessorOptions: config.build.productionSourceMap ?
safe: true,
map:
inline: false
:
safe: true
),
new HtmlWebpackPlugin(
filename: config.build.index,
template: 'template.html',
inject: true,
minify:
removeComments: true,
collapseWhitespace: false,
removeAttributeQuotes: true
,
chunksSortMode: 'dependency'
),
new webpack.HashedModuleIdsPlugin(),
new webpack.optimize.ModuleConcatenationPlugin(),
new webpack.optimize.CommonsChunkPlugin(
name: 'vendor',
minChunks(module)
return (
module.resource &&
/\.js$/.test(module.resource) &&
module.resource.indexOf(
path.join(__dirname, '../node_modules')
) === 0
)
),
new webpack.optimize.CommonsChunkPlugin(
name: 'manifest',
minChunks: Infinity
),
new webpack.optimize.CommonsChunkPlugin(
name: 'app',
async: 'vendor-async',
children: true,
minChunks: 3
),
new CopyWebpackPlugin([
from: path.resolve(__dirname, '../static'),
to: config.build.assetsSubDirectory,
ignore: ['.*']
])
]
)
if (config.build.productionGzip)
const CompressionWebpackPlugin = require('compression-webpack-plugin')
webpackConfig.plugins.push(
new CompressionWebpackPlugin(
asset: '[path].gz[query]',
algorithm: 'gzip',
test: new RegExp(
'\\.(' +
config.build.productionGzipExtensions.join('|') +
')$'
),
threshold: 10240,
minRatio: 0.8
)
)
if (config.build.bundleAnalyzerReport)
const BundleAnalyzerPlugin = require('webpack-bundle-analyzer').BundleAnalyzerPlugin
webpackConfig.plugins.push(new BundleAnalyzerPlugin())
module.exports = webpackConfig
const config = require('../config')
const path = require('path')
module.exports =
dev:
// Paths
assetsSubDirectory: 'static',
assetsPublicPath: '/',
proxyTable: ,
// Various Dev Server settings
host: 'localhost',
port: 8080,
autoOpenBrowser: false,
errorOverlay: true,
notifyOnErrors: true,
poll: false,
devtool: 'cheap-module-eval-source-map',
cacheBusting: true,
cssSourceMap: true
,
build:
// Template for index.html
index: path.resolve(__dirname, '../../index.html'),
// Paths
assetsRoot: path.resolve(__dirname, '../dist'),
assetsRootMain: path.resolve(__dirname, '../../'),
assetsSubDirectory: 'front-end/static',
assetsPublicPath: '',
mainfile : 'front-end/src/main.js',
routerfile : 'front-end/src/router/index.js',
constantsFile : 'utils-bf/constants.js',
productionSourceMap: true,
devtool: '#source-map',
productionGzip: false,
productionGzipExtensions: ['js', 'css'],
bundleAnalyzerReport: process.env.npm_config_report
【问题讨论】：
【参考方案1】：[解决方案]
问题与Webpack的配置有关！ 如果有人遇到同样的问题，只需设置 PublicPath : '/'
output:
publicPath: '/',
path: config.build.assetsRootMain,
filename: utils.assetsPath('js/[name].[chunkhash].js'),
chunkFilename: utils.assetsPath('js/[id].[chunkhash].js')
,
【讨论】：
无法在 AIR 中加载的 SWF 中的文本字段上进行复制/粘贴
】无法在AIR中加载的SWF中的文本字段上进行复制/粘贴【英文标题】：Unabletodocopy/pasteontextfieldsinloadedSWFsinAIR【发布时间】：2013-03-2320:43:00【问题描述】：我的AIR应用程序正在加载一个SWF文件，其中包含一个用于输入的文本字段。... 查看详情
jQuery 访问站点中的 DOM
】jQuery访问站点中的DOM【英文标题】：jQuerytoaccessDOMinasite【发布时间】：2014-10-2818:35:15【问题描述】：我正在尝试从site中抓取表格中的各种元素，以自学使用node.js、cheerio和request进行抓取我在获取表格中的项目时遇到问题，基... 查看详情
如何为 OSX 菜单额外启用复制和粘贴
...一些数据。为该窗口复制粘贴键盘快捷键会很方便。我在我的额外菜单中添加了一个编辑子菜单，以便我定义键盘快捷键。我已经将它们链接到我的控制器中的方法，但是当键入诸如command-v之类的快 查看详情
应用服务中的 Docker 容器无法使用 Node SDK 访问 KeyVault
】应用服务中的Docker容器无法使用NodeSDK访问KeyVault【英文标题】：DockerContainerinAppServicenotabletoaccessKeyVaultwithNodeSDK【发布时间】：2022-01-1207:40:21【问题描述】：我正在应用服务中使用docker-compose运行两个容器。容器被授予获取/列... 查看详情
为啥我无法访问我的 .then() 承诺中的 this.state 变量？ [复制]
】为啥我无法访问我的.then()承诺中的this.state变量？[复制]【英文标题】：WhydoIloseaccesstoathis.statevariableinmy.then()promise?[duplicate]为什么我无法访问我的.then()承诺中的this.state变量？[复制]【发布时间】：2018-07-1703:29:21【问题描述】：... 查看详情
无法访问我的 JSON 文件中的对象/字典元素？节点.js
】无法访问我的JSON文件中的对象/字典元素？节点.js【英文标题】：Can\'taccesselementofobject/dictionaryinmyJSONfile?Node.js【发布时间】：2020-10-2300:48:25【问题描述】：我正在创建一个不和谐的机器人，我需要在JSON文件中存储一个用户列... 查看详情
jquery.com网站点开了jquery下载，显示了一堆jquery代码，要全部复制粘贴到记事本里？详细点解释本人白痴
...另存为”就可以保存到你想要的文件到相应位置了。希望我的回答能化解你的疑问。参考技术A你可以把显示的下载连接复制到迅雷等下载工具中进行下载 参考技术B右键:从链接另存文件为 查看详情
访问自动修改复制粘贴的 VBA 事件代码
】访问自动修改复制粘贴的VBA事件代码【英文标题】：AccessVBAeventcodewhichmodifyingcopy-pasteautomaticly【发布时间】：2017-10-1113:43:10【问题描述】：情况：我有一个需要填写两个坐标字段的访问表单。这些数字字段称为“纬度”和“经... 查看详情
无法在 MinGW shell 中复制/粘贴
】无法在MinGWshell中复制/粘贴【英文标题】：Unabletocopy/pasteinMinGWshell【发布时间】：2013-04-2803:37:27【问题描述】：我刚刚在Windows上安装了MinGW，但我无法像在Linux甚至PuTTY上习惯的那样复制/粘贴。将文本（例如从chrome）复制和粘... 查看详情
NSTextField：公开其复制和粘贴方法
...2013-04-0118:10:38【问题描述】：我正在尝试在其窗口委托中访问NSTextField实例的复制、剪切和粘贴方法，以便我可以自定义这些方法。我发现与tableViews和textViews不同，文本字段的复制、粘贴和剪切操作在委托中没有响应。我的理解... 查看详情
无法访问 Node.js 中的其他文件
】无法访问Node.js中的其他文件【英文标题】：CantaccessotherfilesinNode.js【发布时间】：2021-06-1711:30:46【问题描述】：注意：StackOverflow上有相同的问题，但这不是重复的。请仔细阅读。我刚刚开始在Node上使用Socket.io，在我的HTML文件... 查看详情
插入行以及复制和粘贴值
...态”类型的报告，它从各种来源中提取到一个工作表中。我的最终目标是基本上保留每个条目的日志。所以我创建了一个宏，它将复制Sheet8中的范围，在Sheet11上插入一个新行，然后将该行粘贴到Sheet11中。此外，我添加了一行来... 查看详情
无需选择 vba 即可复制和粘贴
...和选择的使用。我面临的问题是如果不使用Selection，我将无法获得稳定的代码。用于进行选择的PFB代码SubfindandCopyVisbleCellsinColumn(ByRefwbAsWork 查看详情
在textarea上复制，粘贴和剪切操作(代码片段)
...如复制，剪切和粘贴按钮，但即使我尝试了很多次，我也无法获得textarea中的部分文本。它来了所有内容。我的代码如下：functioncopy()varVAL=$("#selection").select();varDTA=$(this).text();document.execCommand("copy");document.execCommand("delete");我的工... 查看详情
无法访问放置在根文件夹中的 yii2 项目中的站点地图
】无法访问放置在根文件夹中的yii2项目中的站点地图【英文标题】：Cannotaccesssitemapinyii2projectplacedinrootfolder【发布时间】：2022-01-1619:13:43【问题描述】：我为我的yii2项目创建了一个sitemap.xml。我将它放在根文件夹中，但我似乎无... 查看详情
Textarea 上的复制、粘贴和剪切操作
...如复制、剪切和粘贴按钮，但即使我尝试了很多次，我也无法在textarea中仅获取部分文本。它包含所有内容。我的代码如下：functioncopy()varVAL=$("#selection"). 查看详情
windowsserver2016-管理站点复制
可以使用ActiveDirectory站点和服务管理单元来管理实现站点间复制拓扑的特定于站点的对象。这些对象存储在ActiveDirectory域服务(ADDS)的站点容器中。同一个站点内的域控制器一般都是通过高速网络连接在一起，复制时不以压缩方式... 查看详情
复制并粘贴我的 xib 文件并保留参考
】复制并粘贴我的xib文件并保留参考【英文标题】：CopyandpastingmyxibfileandkeepingReferences【发布时间】：2013-05-0421:53:17【问题描述】：所以我已经完成了我的AppleStore通用应用程序。所有代码都有效我使用我的iPhonexib文件制作所有视... 查看详情