vue-cli4 for multi-page use `indexPath`in `pages` config - vue-cli-4

I'm using vue-cli4 for multi-page, and I want to be able to use indexPathin pages config. How to do that?

I personally use the filename key in pages object.
module.exports = {
outputDir: "custom_dist",
pages: {
admin: {
entry: "src/admin/main.js",
template: "src/admin/template.html",
filename: "admin/index.html", // >> custom_dist/admin/index.html
// filename: "../admin_dist/index.html", // >> admin_dist/index.html
}
},
}

Related

webpack5 asset module - [DEP_WEBPACK_MODULE_ISSUER] DeprecationWarning: Module.issuer: Use new ModuleGraph API

// webpack image rule
{
test: /\.(png|jpe?g|gif|bpm|svg|webp)(\?.*)?$/,
type: 'asset',
parser: {
dataUrlCondition: function (source, { module }) {
if (/\.less|vue&type=style/.test(module.issuer.resource)) {
return true
}
return source.length < 8092
}
},
...
},
runing the config, I get this:
[DEP_WEBPACK_MODULE_ISSUER] DeprecationWarning: Module.issuer: Use new ModuleGraph API
it means need change code:
module.issuer.resource => compilation.moduleGraph.getIssuer(module).resource.
but parser.dataUrlCondition type is (source: Buffer, { module: Module, filename: string}) => boolean
if there a way to get current compilation that contain moduleGraph property?

asp.net mvc route constraints regular expression

I want to server dynamic pages using url without controller and action on the basis of page title
default url : domain.com/pages/details/1
I want this to be server as
domain.com/title-of-dynamic-page-in-db-space-replaced-with-dash
domain.com/about-us
domain.com/contact-us
if I am doing this without dash than routing will confuse with controller name
thats why I added dash - for dynamic pages
my action looks like this
// GET: Pages/View/5
public ActionResult View(string id)
{
if (id == null)
{
return new HttpStatusCodeResult(HttpStatusCode.BadRequest);
}
Page page = db.Pages.First(p => p.name_english == id.Replace("-"," "));
if (page == null)
{
return HttpNotFound();
}
}
my routes are
routes.MapRoute(
name: "aaaaa",
url: "{id}",
defaults: new { controller = "pages", action = "view" },
constraints: new { id = #"^[A-Za-z\d-]+$" } //*********help needed in this line ******************************
);
routes.MapRoute(
name: "Default",
url: "{controller}/{action}/{id}",
defaults: new { controller = "Home", action = "Index", id = UrlParameter.Optional }
);
above Constrain ^[A-Za-z\d-]+$
accepts alpha(optional) numeric(optional) and dash(optional)
while I need alpha(optional) numeric(optional) and dash(*mandatory*)
this way routing engine will not confuse page title with controller/action as I will make sure my name of dynamic page will contain space(i m replacing with dash)
and my controller/action will not be named contained dash
also tell me, is this approach ok or not, is there any other optimized solution for this?
I hope the following snippet will work for you.
routes.MapRoute(
name: "aaaaa",
url: "{id}",
defaults: new { controller = "pages", action = "view" },
constraints: new { id = #"^([-]*[a-zA-Z0-9]*-[a-zA-Z0-9]*[-]*)+$" } //*********this should work**
);
//---------------------------------------
// ^([-]*[a-zA-Z0-9]*-[a-zA-Z0-9]*[-]*)+$
//---------------------------------------

When launching icCube report how can I get the user name

in ic3Report.html file, is it possible to get the user name in the callback function ?
var options = {
root: "ic3-report/app/",
rootLocal: "ic3-report/app-local/",
rootVersion: "_IC3_ROOT_VERSION_",
callback: function () {
$('#intro').remove();
window.ic3application = ic3.startReport(
{
<!-- ic3-start-report-options (DO NOT REMOVE - USED TO GENERATE FILES) -->
});
// get user name here !
}
};
in order to gather current user information you should setup GVI configuration. It could be done with appropriate method:
var options = {
root: "ic3-report/app/",
rootLocal: "ic3-report/app-local/",
rootVersion: "_IC3_ROOT_VERSION_",
callback: function () {
$('#intro').remove();
var ic3reporting = new ic3.Reporting(
{
noticesLevel: ic3.NoticeLevel.INFO,
dsSettings: {
url: GVI_URL
}
});
ic3reporting.setupGVIConfiguration(function () {
var userName = ic3reporting.userName();
})
}
};
After that user information will be available inside context. See code above for details.
Update
A more robust solution is adding the code to the local files that are not overwritten with a new version of the reporting. You can use ic3bootstrapLocal function in Admin > Common JS configuration.
function ic3bootstrapLocal(options) {
var ic3reporting = new ic3.Reporting({
noticesLevel: ic3.NoticeLevel.INFO,
});
ic3reporting.setupGVIConfiguration(function(){
ic3reporting.userName()
options.callback && options.callback();
});
}

Extend all views with custom data and filters in Sails.js

I'm developing a Sails.js application and I want to extend all views with custom data and functions.
What would be the best course of action to do so?
I've tried to create a policy to do so, but policies are only applied to routes with controllers.
Custom data
You can use a custom hook in order to achieve that.
Create a file at the specified path: api/hooks/viewsGlobals/index.js with the following content:
module.exports = function viewsGlobals (sails) {
return {
routes: {
before: {
// This middleware will be executed for every request.
'*': function (req, res, next) {
// Using condition to filter out static file requests.
if (req.accepted.some(function (type) {
return type.value === 'text/html';
})) {
res.locals.someData = {
// Place your custom data here.
};
}
return next();
}
}
}
}
};
Custom filters
Create a file at the following path: config/view-filters/toUpper.js and the following content:
// Replace this with templating engine that you use.
var swig = require('swig');
// Use the API of your templating engine to add custom filter.
swig.setFilter('toUpper', function (value) {
return value.toUpperCase();
});

Rewrite cookie paths when using grunt-connect-proxy

During development I use grunt-connect-proxy to make some remote APIs locally available. This works just fine, except that the rewrite rules that I use are not applied to cookies:
proxies: [{
context: '/publicPath',
host: 'localhost',
port: 8080,
rewrite: {
'^/publicPath': '/privatePath'
}
}]
If the remote API sets a cookie with path /privatePath it must be rewritten to /publicPath.
E.g. When using Apache httpd I'd use the ProxyPassReverseCookiePath-Directive. How do I do it with grunt-connect-proxy?
Thanks to this answer in "Rewrite response headers with node-http-proxy" I managed to figure it out. I created the following middleware:
function rewriteSetCookie(req, res, next) {
var isProxyRequest = req.url.lastIndexOf('/publicPath', 0) === 0;
if (isProxyRequest) {
// we intercept the writeHead function, so that we can exchange headers just before they are written
var oldWriteHead = res.writeHead;
res.writeHead = function () {
var cookie = res.getHeader('Set-Cookie');
if (cookie) {
res.setHeader('Set-Cookie', cookie.map(function(item) {
// Replace paths in all cookies. The simple string/replace approach might be too naive in some cases, so check before you copy&paste before thinking
return item.replace(/\/privatePath/, '/publicPath');
}));
}
oldWriteHead.apply(res, arguments);
};
}
next();
}
Just for reference here is the full configuration so that you can see how to use the middleware:
connect: {
server: {
options: {
hostname: 'localhost',
base: 'myBaseDir',
open: true,
middleware: function (connect, options) {
if (!Array.isArray(options.base)) {
options.base = [options.base];
}
// Setup the proxy
var middlewares = [rewriteSetCookie, proxySnippet];
// ^^^^^^^^^^^^^^^^- Here is is used!
// Serve static files.
options.base.forEach(function(base) {
middlewares.push(connect.static(base));
});
// Make directory browse-able.
var directory = options.directory || options.base[options.base.length - 1];
middlewares.push(connect.directory(directory));
return middlewares;
}
},
proxies: [{
context: '/publicPath',
host: 'localhost',
port: 8080,
rewrite: {
'^/publicPath': '/privatePath'
}
}]
}
}